¿Cómo separar la sección de otra sección en HTML?

La etiqueta de sección HTML define la sección de documentos como capítulos, encabezados, pies de página o cualquier otra sección. La etiqueta de sección divide el contenido en secciones y subsecciones. La etiqueta de sección se utiliza cuando se necesitan requisitos de dos encabezados o pies de página o cualquier otra sección de documentos. Etiqueta de sección que agrupaba el bloque genérico de contenidos relacionados. La principal ventaja de la etiqueta de sección es que es un elemento semántico que describe su significado tanto para el navegador como para el desarrollador.

En este artículo, discutiremos cómo separar la sección de otra sección en HTML.

Sintaxis : la etiqueta de sección se utiliza para distribuir el contenido, es decir, distribuye las secciones y subsecciones.  

<section> Section Contents </section>

Ejemplo:

HTML

<!DOCTYPE html>
<html>
  
<body>
    <!-- html section tag is used here -->
    <section>
        <h1>Geeksforgeeek: Section 1</h1>
        <p>Content of section 1</p>
    </section>
    
    <section>
        <h1>GeeksforGeeks: Section 2</h1>
        <p>Content of section 2</p>
    </section>
    
    <section>
        <h1>GeeksforGeeks: Section 3</h1>
        <p>Content of section 3</p>
    </section>
</body>
  
</html>

Producción:

Etiqueta de sección anidada : la etiqueta de sección se puede anidar. El tamaño de fuente de la subsección es más pequeño que la etiqueta de la sección si el texto contiene la misma propiedad de fuente. La etiqueta de subsección se utiliza para organizar documentos complejos. Una regla general es que la sección debe aparecer lógicamente en el esquema del documento.

Ejemplo:

HTML

<!DOCTYPE html>
<html>
  
<body>
    <!-- html section tag is used here -->
    <section>
        <h1>Geeksforgeeek: Section 1</h1>
        <p>Content of section 1</p>
        <section>
            <h1>Subsection</h1>
            <h1>Subsection</h1>
        </section>
    </section>
  
    <section>
        <h1>GeeksforGeeks: Section 2</h1>
        <p>Content of section 2</p>
        <section>
            <h1>Subsection</h1>
            <h1>Subsection</h1>
        </section>
    </section>
</body>
  
</html>

Producción:

Publicación traducida automáticamente

Artículo escrito por sravankumar8128 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *