Seguimos publicando vídeos en el Videotutorial de CSS, para explicar las hojas de estilo en cascada de la manera más sencilla y visual. En este vídeo vamos a mostrar un concepto sencillo que debemos conocer antes de ponernos a explicar otros temas más complejos como el posicionamiento CSS. Se trata del flujo HTML de la página y los atributos CSS que pueden afectar al flujo de la página.

El flujo de los elementos es un concepto que posiblemente ya conoceremos, aunque puede que no lo hayamos identificado como tal y como nos vamos a referir a él repetidas veces a lo largo de los siguientes vídeos, merece la pena detenerse para explicarlo, de modo que quede claro lo que es.

El flujo HTML, es el modo en que los elementos de la página, representados por etiquetas HTML, se van situando en el lienzo para componer la página web que nos muestra el navegador. Existe un método estándar de colocación de los elementos de la página, que el propio cliente web implementa cuando no se especifica nada, pero nosotros a través de distintos atributos CSS y sus valores podemos alterarlo para que dichos elementos se posicionen como deseamos.

Como decíamos, este videotutorial servirá de entrada a los siguientes vídeos en los que abordaremos el posicionamiento CSS. Los atributos que veremos en esta ocasión los explicaremos de pasada y sólo nos detendremos para especificar distintos valores de atributos y cómo éstos afectan al flujo de la página.

Comenzaremos viendo el atributo CSS display y cómo pueden afectar al flujo del HTML en un elemento en particular al asignarle los valores block e inline. Luego mostraremos otro atributo CSS bastante utilizado que es float y cómo afectan los valores right y left en dicho atributo al fujo estándar del HTML. Luego veremos una breve introducción al atributo position, que es clave para el posicionamiento CSS y que tendremos que explicar con detalle en sucesivos vídeos, puesto que tiene muchos valores distintos que afectan radicalmente al flujo de la página y que nos servirán para posicionar los elementos que queremos con total precisión.

En esta ocasión hemos publicado un vídeo de una duración un poco más corta que la que estamos acostumbrados a ofreceros en el Vídeo Tutorial de CSS, pues el flujo HTML realmente es un concepto sencillo. Sin más os dejamos con el vídeo. Serán aproximadamente 20 minutos de auténtica práctica en CSS, que esperamos sean de utilidad para los visitantes de DesarrolloWeb.com.

Para las personas que lo prefieran, también hemos colocado este mismo vídeo sobre el flujo HTML en Youtube, sitio desde el cual posiblemente algunas personas puedan ver mejor estos materiales, precursores de las explicaciones de posicionamiento CSS.