Cada elemento HTML tiene un valor de visualización predeterminado, según el tipo de elemento que sea.
Hay dos valores de visualización: bloque & línea.
Elementos en bloque
Un elemento de nivel bloque siempre comienza en una nueva línea, y los navegadores automáticamente agregan algo de espacio (margen) antes y después del elemento.
Un elemento de nivel bloque siempre ocupa todo el ancho disponible (se extiende hacia la izquierda y derecha lo más que pueda)
Dos elementos de bloque de uso común son: <p> y <div>
El elemento <p> define un párrafo en un documento HTML.
El elemento <div> define una división o una sección en un documento HTML.
Ejemplo:
Lista completa de elementos nivel bloque:
Elementos en línea
Un elemento en línea no comienza en una nueva línea.
Un elemento en línea solo ocupa el ancho necesario.
Ejemplo:
Lista completa de elementos en línea:
Nota: un elemento en línea no puede contener un elemento en bloque
El elemento div
El elemento <div> a menudo se utiliza como contenedor para otros elementos HTML.
El elemento <div> no tiene atributos requeridos, pero los atributos style, class y id son muy comunes.
Cuando se utiliza junto con CSS, el elemento <div> se puede usar para diseñar bloques de contenido:
Ejemplo:
El elemento span
El elemento <span> es un contenedor en línea que se utiliza para marcar una parte de un texto o una parte de un documento.
El elemento <span> no tiene atributos requeridos, pero los atributos style, class y id son muy comunes.
Cuando se utiliza junto con CSS, el elemento <span> se puede usar para diseñar partes del texto.
Ejemplo:
Resumen
En HTML hay dos tipos de valores de visualización: bloque & línea
Un elemento de nivel bloque siempre comienza en una nueva línea y ocupa todo el ancho disponible.
Un elemento en línea no comienza en una nueva línea y solo ocupa el ancho necesario.
El elemento
<div>es un elemento de nivel bloque, y a menudo se usa como contenedor para otros elementos HTML.El elemento
<span>es un contenedor en línea que se utiliza para marcar una parte de un texto o una parte de un documento.
Traducido con 💚 desde W3Schools.com