Etiquetas HTML <h1> a <h6>
Ejemplo
Los seis encabezados HTML diferentes:
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
Más ejemplos de "Pruébelo usted mismo" a continuación.
Definición y uso
Las etiquetas <h1>to <h6>se utilizan para definir encabezados HTML.
<h1>define el encabezado más importante. <h6>define el encabezado menos importante.
Nota: Solo use uno <h1>
por página; esto debería representar el encabezado/tema principal de toda la página. Además, no se salte los niveles de encabezado: comience con <h1>, luego use <h2>, y así sucesivamente.
Compatibilidad con navegador
| Element | |||||
|---|---|---|---|---|---|
| <h1> - <h6> | Yes | Yes | Yes | Yes | Yes |
Atributos globales
Las etiquetas <h1>to <h6>también admiten los atributos globales en HTML .
Atributos de eventos
Las etiquetas <h1>to <h6>también admiten los atributos de evento en HTML .
Más ejemplos
Ejemplo
Establezca el color de fondo y el color del texto de los encabezados (con CSS):
<h1 style="background-color:DodgerBlue;">Hello World</h1>
<h2 style="color:Tomato;">Hello
World</h2>
Ejemplo
Establecer la alineación de los encabezados (con CSS):
<h1 style="text-align:center">This is heading 1</h1>
<h2 style="text-align:left">This
is heading 2</h2>
<h3 style="text-align:right">This is heading 3</h3>
<h4 style="text-align:justify">This is heading 4</h4>
páginas relacionadas
Tutorial HTML: Encabezados HTML
Referencia HTML DOM: Objeto de encabezado
Configuración predeterminada de CSS
La mayoría de los navegadores mostrarán el <h1>elemento con los siguientes valores predeterminados:
Ejemplo
h1 {
display: block;
font-size: 2em;
margin-top: 0.67em;
margin-bottom: 0.67em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
La mayoría de los navegadores mostrarán el <h2>elemento con los siguientes valores predeterminados:
Ejemplo
h2 {
display: block;
font-size: 1.5em;
margin-top: 0.83em;
margin-bottom: 0.83em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
La mayoría de los navegadores mostrarán el <h3>elemento con los siguientes valores predeterminados:
Ejemplo
h3 {
display: block;
font-size: 1.17em;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
La mayoría de los navegadores mostrarán el <h4>elemento con los siguientes valores predeterminados:
Ejemplo
h4 {
display: block;
font-size:
1em;
margin-top: 1.33em;
margin-bottom: 1.33em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
La mayoría de los navegadores mostrarán el <h5>elemento con los siguientes valores predeterminados:
Ejemplo
h5 {
display: block;
font-size: .83em;
margin-top: 1.67em;
margin-bottom: 1.67em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}
La mayoría de los navegadores mostrarán el <h6>elemento con los siguientes valores predeterminados:
Ejemplo
h6 {
display: block;
font-size: .67em;
margin-top: 2.33em;
margin-bottom: 2.33em;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}