Los párrafos y otros elementos en bloque tienen un comportamiento por defecto bien definido en CSS3. Toman todo el ancho de la página, y el siguiente elemento aparece a continuación. Cuando se aplica el elemento a un párrafo, el comportamiento de ese párrafo no cambia mucho, pero el comportamiento de subsiguiente párrafos se altera.

Comience por mirar una página con tres párrafos. El párrafo 2 tiene su flotador propiedad establecida en izquierda.

Video: Programacion Web #2 - Etiquetas de HTML y sus atributos [HTML5, CSS3, JQuery]

Como se puede ver, algo de formato extraño está pasando aquí. Echar un vistazo a lo que está pasando:

Fronteras se han añadido a los párrafos. Como verá, el ancho de un elemento no siempre es evidente examinado su contenido. Cuando usted está jugando con flotador, podría ser conveniente añadir los bordes de los párrafos para que pueda ver lo que está pasando. Siempre se puede quitar las fronteras cuando se tiene que trabajar bien.
El primer párrafo actúa normalmente. El primer párrafo tiene el mismo comportamiento que se observa en todos los elementos de estilo bloque. Se necesita toda la anchura de la página, y el siguiente elemento se colocará debajo de ella.
El segundo párrafo es bastante normal. El segundo párrafo tiene su flotador atributo establecido como izquierda. Esto significa que el párrafo se colocará en su posición normal, pero ese otro texto se coloca a la derecha de este elemento.
El tercer párrafo parece flaco. El tercer párrafo parece rodear el segundo, pero el texto es empujado hacia la derecha. los flotador parámetro en el párrafo anterior hace que éste sea colocado en cualquier espacio restante (que en la actualidad no es mucho). El espacio restante está a la derecha y, finalmente, por debajo del segundo párrafo.

Video: Programacion HTML y CSS. 03 - Títulos y Párrafos

El código para producir esto es simple HTML con CSS marcado igualmente simple:

floatDemo

flotar demostración

Párrafo 1. Este párrafo tiene el comportamiento normal de un nivel de bloque element.It ocupa todo el ancho de la página, y la siguiente Elementis coloca debajo.

Párrafo 2. Este párrafo se hace flotar izquierda. Se coloca a la izquierda, y thenext elemento se coloca a la derecha de la misma.

Párrafo 3. Este párrafo no tiene flotante, anchura o margen. Se necesita whateverspace pueda a la derecha del elemento flotante y, a continuación, flowsto la siguiente línea.

Como se puede ver en el código, hay una clase sencilla llamada flotaba con el flotador propiedad establecida en izquierda. Los párrafos se definen en la forma ordinaria. A pesar de que el párrafo 2 parece estar incrustado en el párrafo 3 de la captura de pantalla, el código muestra claramente que este no es el caso. Los dos párrafos están completamente separados.