Semantic UI ofrece muchos componentes para que los usuarios diseñen su interfaz. El componente de encabezado nos ofrece diferentes tipos de encabezados, diferentes tipos de contenido que contienen encabezados, estados de encabezado en diferentes variaciones.
En este artículo, aprenderemos sobre los estados de encabezado de la interfaz de usuario semántica . Estos estados se utilizan para definir el estado de cualquier encabezado de dedicación. El valor predeterminado del estado es activo.
Clase de estados de encabezado de interfaz de usuario semántica:
- disabled : esta clase se utiliza para desactivar o desactivar el encabezado dedicado.
Nota: Solo hay un estado en el encabezado, por lo que el valor estará deshabilitado.
Sintaxis:
<div class="ui Header-Statesheader"> .... </div>
El siguiente ejemplo ilustra los estados del encabezado de la interfaz de usuario semántica:
Ejemplo:
HTML
<!DOCTYPE html> <html> <head> <link href= "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" rel="stylesheet" /> </head> <body> <center> <h1 style="color: green"> GeeksforGeeks </h1> <strong>Semantic UI Header States</strong> <br><br> </center> <div class="container" style="margin-left: 15px;"> <strong>Disabled Header:</strong> <div class="ui disabled header"> GeeksforGeeks: A Computer Science Portal for Geeks. </div> <strong>Enabled Header(Default):</strong> <div class="ui header"> GeeksforGeeks: A Computer Science Portal for Geeks. </div> </div> </body> </html>
Producción:
Estados de encabezado de interfaz de usuario semántica
Referencia: https://semantic-ui.com/elements/header.html
Publicación traducida automáticamente
Artículo escrito por skyridetim y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA