Читать книгу El gran libro de HTML5, CSS3 y Javascript - Diego Gauchat Juan - Страница 61

Por defecto, todos los navegadores ordenan los elementos de un sitio web básicamente según su tipo: elementos de bloque o en línea. Esta clasificación se basa en la manera en la que los elementos se muestran en la pantalla.

 Los elementos de bloque se colocan uno tras otro en la página.

 Los elementos en línea se colocan de lado a lado, uno junto al otro en la misma línea, sin ningún salto de línea salvo que no haya suficiente espacio horizontal.

Casi todos los elementos estructurales de nuestro documento son tratados por defecto como un elemento de bloque. Eso significa que cada etiqueta HTML que representa una parte de la organización visual (por ejemplo, <section>, <nav>, <header>, <footer>, <div>) se colocarán una debajo de la otra.

En el Capítulo 1 creamos un documento HTML para representar el diseño típico de una página web. Éste incluía barras horizontales y dos columnas en medio. Debido a la forma en la que los navegadores muestran estos elementos por defecto, el resultado obtenido en pantalla estaba muy lejos de lo esperado. Si abre el archivo HTML que contiene el Código 1-20 (Capítulo 1) en su navegador, podrá identificar inmediatamente las posiciones incorrectas de las columnas definidas como <section> y <aside>. Una está bajo la otra en lugar de estar una junto a la otra, debido a que cada bloque es mostrado por defecto con el mayor ancho posible, tan largo como la información que contiene y uno bajo el otro, como se muestra en la Figura 2-1.

Figura 2-1

Representación visual de un diseño de página con estilos predeterminados.