El botón de interfaz de usuario semántica ofrece varios tipos de componentes de microbotones como tipos, grupos, contenido, estados, variaciones y variaciones de grupo.
Las variaciones de Button tienen diferentes tipos de botones, como Social, Diferente tamaño, Flotante, Coloreado, Compacto, Alternar, Positivo, Negativo, Fluido, Circular, Botones adjuntos vertical y horizontalmente. En este artículo aprenderemos sobre los botones unidos verticalmente.
Variaciones del botón de la interfaz de usuario semántica Clase adjunta verticalmente:
- adjunto superior: esta clase se utiliza para adjuntar el botón en la parte superior del segmento.
- adjunto inferior: esta clase se utiliza para adjuntar el botón en la parte inferior del segmento.
Sintaxis:
<div class="ui top attached button">..</div> <div class="ui ..."> <p></p> </div> <div class="ui bottom attached button">..</div>
El siguiente ejemplo ilustra las variaciones de botón:
Ejemplo:
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 Vertically Attached</strong> <br><br> <div> <div> <strong>Vertically Attached:</strong> <div class="ui top attached green button"> Top Vertically Attached </div> <div class="ui attached segment"> <p>A Computer Science Portal for Geeks</p> </div> <div class="ui bottom attached purple button"> Bottom Vertically Attached </div> </div> </div> </center> </body> </html>
Producción:
Variaciones de botón de interfaz de usuario semántica adjuntas verticalmente
Referencia: https://semantic-ui.com/elements/button.html#vertical-attached
Publicación traducida automáticamente
Artículo escrito por skyridetim y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA