La etiqueta <header> en HTML se usa para definir el encabezado de un documento o una sección, ya que contiene la información relacionada con el título y el encabezado del contenido relacionado. El elemento <header> normalmente contiene el encabezado de la sección (un elemento h1-h6 o un elemento <hgroup>), pero esto no es obligatorio. También se puede usar para envolver la tabla de contenido de una sección, un formulario de búsqueda o cualquier logotipo relevante. La etiqueta <header> es una etiqueta nueva en HTML5 y es una etiqueta de contenedor, es decir, contiene una etiqueta de inicio, contenido y la etiqueta de finalización. Puede haber varios elementos <header> en un documento. Esta etiqueta no se puede colocar dentro de un <footer>, <address> u otro elemento <header>.
Sintaxis:
<header> ...</header>
Atributos : esta etiqueta admite todos los atributos globales en HTML.
Los siguientes ejemplos ilustran el elemento <header> en HTML.
Ejemplo 1: este ejemplo ilustra el uso de la etiqueta <header> que constituye el contenedor de la sección de encabezado del documento.
HTML
<!DOCTYPE html> <html> <body> <h1>GeeksforGeeks</h1> <h3>HTML Header Tag</h3> <hr> <article> <header> <h3>GeeksforGeeks Learning</h3> <p>Posted by GFG</p> <p> A Computer Science portal for geeks. It contains well written, well thought and well explained computer science and programming articles. </p> </header> </article> </body> </html>
Producción:
Ejemplo 2: En este ejemplo, hemos usado la etiqueta <header> para contener el encabezado de la sección circundante, pero no siempre es necesario.
HTML
<!DOCTYPE html> <html> <body> <h1>GeeksforGeeks</h1> <h3>HTML Header Tag</h3> <!--HTML header tag starts here--> <header> <h1>This is the heading.</h1> <h4>This is the sub-heading.</h4> <p>This is the metadata.</p> </header> <!--HTML header tag ends here--> </body> </html>
Producción:
Ejemplo 3: En este ejemplo, hemos representado ayudas a la navegación usando la etiqueta <header>.
HTML
<!DOCTYPE html> <html> <body> <h1>GeeksforGeeks</h1> <h3>HTML Header Tag</h3> <!--HTML header tag starts here--> <header> <a href= "https://www.geeksforgeeks.org/fundamentals-of-algorithms/"> Algo</a> | <a href= "https://www.geeksforgeeks.org/data-structures/"> DS</a> | <a href= "https://www.geeksforgeeks.org/category/program-output/"> Languages</a> | <a href= "https://www.geeksforgeeks.org/company-interview-corner/"> Interview</a> | <a href= "https://www.geeksforgeeks.org/student-corner/"> Students</a> | <a href= "https://www.geeksforgeeks.org/gate-cs-notes-gq/"> Gate</a> | <a href= "https://www.geeksforgeeks.org/articles-on-computer-science-subjects-gq/"> CS Subjects</a> | <a href= "https://www.geeksforgeeks.org/quiz-corner-gq/"> Quizzes</a> </header> <!--HTML header tag ends here--> </body> </html>
Producción:
Navegadores compatibles:
- Google Chrome 5 y superior
- Internet Explorer 9 y superior
- Microsoft Edge 12 y superior
- Firefox 4 y superior
- Ópera 11.1 y superior
- Safari 5 y superior
HTML es la base de las páginas web, se utiliza para el desarrollo de páginas web mediante la estructuración de sitios web y aplicaciones web. Puede aprender HTML desde cero siguiendo este tutorial de HTML y ejemplos de HTML .
Publicación traducida automáticamente
Artículo escrito por Shubrodeep Banerjee y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA