Primer CSS es un marco CSS gratuito de código abierto que se basa en sistemas que crean la base de los elementos de estilo básicos, como el espaciado, la tipografía y el color. Este método sistemático garantiza que nuestros patrones sean estables e interoperables entre sí. Su enfoque de CSS está influenciado por los principios de CSS orientado a objetos, CSS funcional y arquitectura BEM. Es altamente reutilizable y flexible. Está creado con el sistema de diseño de GitHub.
Primer CSS Subhead es un contenedor que tiene un borde inferior gris claro. Podemos usar la clase Subhead-heading para crear el encabezado de Subhead. Podemos usar otras clases como Subhead-description, Subhead-actions, Subhead–spacious , etc.
Primer CSS Clases de subtítulos:
- Subtítulo: Esta clase se utiliza para crear el subtítulo.
- Subhead-heading: Esta clase se utiliza para crear el encabezado del subtítulo.
- Subtítulo–espacioso: esta clase se utiliza para crear el subtítulo con un margen superior.
- Subhead-description: esta clase se utiliza para proporcionar una descripción.
- Subhead-actions: esta clase se utiliza para crear el subtítulo con botones de acción.
- Subhead-heading–danger: esta clase se utiliza para crear el subtítulo de peligro.
Sintaxis:
<div class="Subhead">
<h2 class="Subhead-heading">
...
</h2>
...
</div>
Ejemplo 1: Este ejemplo demuestra la implementación de Primer CSS Subhead utilizando las clases Subhead, Subhead-heading y Subhead-description .
HTML
<!DOCTYPE html> <html> <head> <title> Primer CSS Subhead </title> <link rel="stylesheet" href= "https://unpkg.com/@primer/css@^18.0.0/dist/primer.css" /> </head> <body> <div class="text-center"> <h1 class="color-fg-success"> GeeksforGeeks </h1> <h3> Primer CSS Subhead </h3> <br> <div class="Subhead"> <h2 class="Subhead-heading"> GFG Plain Subhead with description </h2> <div class="Subhead-description"> A Computer Science portal for geeks. </div> </div> </div> </body> </html>
Producción:
Primer subtítulo CSS
Ejemplo 2: Este ejemplo demuestra la implementación de Primer CSS Subhead utilizando las clases Subhead–spacious, Subhead-actions y Subhead-heading–danger .
HTML
<!DOCTYPE html> <html> <head> <title> Primer CSS Subhead </title> <link rel="stylesheet" href= "https://unpkg.com/@primer/css@^18.0.0/dist/primer.css" /> </head> <body class="m-2"> <div class="text-center"> <h1 class="color-fg-success"> GeeksforGeeks </h1> <h3> Primer CSS Subhead </h3> <br> <div class="Subhead Subhead--spacious"> <h2 class="Subhead-heading Subhead-heading--danger"> GFG Spacious Subhead </h2> <div class="Subhead-actions"> <a href="#url" class="btn btn-sm btn-primary"> GeeksforGeeks </a> </div> </div> </div> </body> </html>
Producción:
Primer subtítulo CSS
Referencia: https://primer.style/css/components/subhead
Publicación traducida automáticamente
Artículo escrito por singh_teekam y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA