Blaze UI es un marco de código abierto de CSS . Es un conjunto de herramientas de interfaz de usuario liviano y proporciona excelentes herramientas para crear aplicaciones personalizadas y escalables. Puede funcionar con cualquier framework que exista. Puede adaptarse a cualquier ecosistema. Todos los diseños o CSS son móviles primero y, por lo tanto, receptivos. Su proyecto está disponible en código abierto, por lo que una gran comunidad lo mantiene.
Una insignia es un componente esencial de un sitio web. Es útil cuando desea agregar información adicional, como el número de versión del software o para mensajes de estado que muestran un texto en particular al usuario. Los colores de las insignias de Blaze UI se utilizan para crear diferentes colores de insignias usando las siguientes clases.
Blaze UI Insignias Colores Clases:
- c-badge: esta clase se utiliza para crear la insignia de color predeterminada.
- c-badge–brand: esta clase se utiliza para crear la insignia de color de la marca.
- c-badge–info: esta clase se utiliza para crear la insignia de color de información.
- c-badge–warning: esta clase se utiliza para crear el distintivo de color de advertencia.
- c-badge–success: esta clase se utiliza para crear la insignia de color de éxito.
- c-badge–error: esta clase se utiliza para crear la insignia de color de error.
Sintaxis:
<span class="c-badge Badges-Colors-Class">
...
</span>
Ejemplo 1: este ejemplo muestra los colores de las insignias de la interfaz de usuario de Blaze mediante las clases c-badge, c-badge–brand y c-badge–info .
HTML
<!DOCTYPE html> <html lang="en"> <head> <title> Blaze UI Badges Colors </title> <link rel="stylesheet" href= "https://unpkg.com/@blaze/css@x.x.x/dist/blaze/blaze.css" /> </head> <body> <div class="u-centered"> <h1 style="color: green;"> GeeksforGeeks </h1> <h3> Blaze UI Badges Colors </h3> <span class="c-badge"> GFG Default </span> <span class="c-badge c-badge--brand"> GFG Brand </span> <span class="c-badge c-badge--info"> GFG Info </span> </div> </body> </html>
Producción:
Colores de las insignias de la interfaz de usuario de Blaze
Ejemplo 2: este ejemplo muestra los colores de las insignias de la interfaz de usuario de Blaze mediante las clases c-badge–warning, c-badge–success y c-badge–error .
HTML
<!DOCTYPE html> <html lang="en"> <head> <title> Blaze UI Badges Colors </title> <link rel="stylesheet" href= "https://unpkg.com/@blaze/css@x.x.x/dist/blaze/blaze.css" /> </head> <body> <div class="u-centered"> <h1 style="color: green;"> GeeksforGeeks </h1> <h3> Blaze UI Badges Colors </h3> <span class="c-badge c-badge--warning"> GFG Warning </span> <span class="c-badge c-badge--success"> GFG Success </span> <span class="c-badge c-badge--error"> GFG Error </span> </div> </body> </html>
Producción:
Colores de las insignias de la interfaz de usuario de Blaze
Referencia: https://www.blazeui.com/components/badges/
Publicación traducida automáticamente
Artículo escrito por harendra4373 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA