Ahora exploraremos las principales etiquetas HTML que a menudo se utilizan en la etiqueta body de un documento HTML.Elementos en línea y elementos en bloqueAntes de analizar las etiquetas, necesitamos separarlas en 2 categorías: elementos en bloque y elementos en línea.
Los elementos en línea, en cambio, pueden estar junto a otros elementos en línea.
Otra diferencia es que los elementos en línea pueden estar contenidos en elementos en bloque. Lo contrario no es cierto.
p y span
La etiqueta p define un párrafo de texto, y es un elemento en bloque:
<p>Algo de texto</p>
Ya has visto el aspecto en bloque de la etiqueta p antes cuando hicimos el ejemplo: p estaba en su propia línea.
Dentro de una etiqueta p, podemos agregar cualquier elemento en línea que deseemos, como span.
La etiqueta span es un elemento en línea:
<p>Una parte del texto <span>y aquí otra parte</span></p>
No podemos agregar otros elementos en bloque en una etiqueta p o span.
No podemos anidar un elemento p en otro, ya que p es una etiqueta en bloque.
Etiquetas de encabezado (h1, h2…)
HTML nos proporciona 6 etiquetas de encabezado. Desde el más importante hasta el menos importante, tenemos h1, h2, h3, h4, h5, h6.
Típicamente, una página tendrá un elemento h1, que es el título de la página. Luego, es posible que tengas uno o más elementos h2 dependiendo del contenido de la página.
El navegador, de forma predeterminada, renderizará la etiqueta h1 más grande, y reducirá el tamaño de los elementos a medida que el número cerca de h aumenta:
<h1>Encabezado h1</h1> <h2>Encabezado h2</h2> <h3>Encabezado h3</h3> <h4>Encabezado h4</h4> <h5>Encabezado h5</h5> <h6>Encabezado h6</h6>
Todos los encabezados son elementos en bloque. No pueden contener otras etiquetas, excepto etiquetas que identifican texto como un span o strong (también llamado contenido de frases, lista completa aquí).