Creo que el título es un poco confuso, puede ser Botones de colores de variaciones de botones de interfaz de usuario semántica si este es el elemento https://semantic-ui.com/elements/button.html#colored-buttons
El grupo de botones de interfaz de usuario semántica también ofrece una variación de grupo de botones, hay botones de icono, botones de icono etiquetados, botones de grupo mixto, ancho igual, botón de color, botones básicos y botones de tamaño de grupo, etc.
En este artículo hablaremos sobre los botones de colores. Los botones de colores pueden tener un color compartido, aquí podemos crear un grupo de botones simple que seguirá a un botón de color fijo, cada botón será el mismo dentro de ese grupo.
Variaciones de botones de interfaz de usuario semántica Clase de botones de colores:
- color-name*: esta es la variable, puede simplemente colocar el nombre del color en el elemento div para colorear todo el grupo en un solo color.
Sintaxis:
<div class="color-name* ui buttons"> <button class="ui button">...</button> <button class="ui button">..</button> .... </div>
El siguiente ejemplo ilustra los botones de colores de las variaciones de los botones de la interfaz de usuario semántica:
Ejemplo 1: En este ejemplo, aplicaremos el color de grupo en el botón Normal y los botones básicos. Puede aplicar color en cualquier grupo de botones.
HTML
<!DOCTYPE html> <html> <head> <title>Semantic UI</title> <link href= "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" rel="stylesheet" /> </head> <body> <center> <h1>Geeksforgeeks:</h1> <strong>Semantic UI Button Variations Colored Buttons</strong> </center> <br><br> <strong>Coloured Buttons:</strong> <br> <div class="ui blue buttons"> <button class="ui button">Like</button> <button class="ui button">Share</button> <button class="ui button">Subscribe</button> </div> <br> <strong>Coloured basic buttons:</strong> <br> <div class="ui blue basic buttons"> <button class="ui button">Like</button> <button class="ui button">Share</button> <button class="ui button">Subscribe</button> </div> </body> </html>
Producción:
Botones de colores de variaciones de la interfaz de usuario semántica
Referencia: https://semantic-ui.com/elements/button.html#colored-buttons
Publicación traducida automáticamente
Artículo escrito por skyridetim y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA