Float CSS
El estilo «float» sirve para alinear un elemento, haciendo que el texto de alrededor del mismo se agrupe entorno a dicho elemento. Sus posibles valores son «left» (para alinear el elemento a la izquierda) y «right» (para alinearlo a la derecha).Un elemento con float CSS debe tener definida su anchura. De no ser así, no será tratado como tal y el estilo no se aplicará.
Visualiza ahora un ejemplo de un elemento con el estilo “float”:
Para entenderlo mejor, lo ideal es ver el estilo «float» implementado en un portal. Para ello, nosotros recomendamos echar un vistazo al portal TerraChat.net, que nos parece un fenomenal ejemplo de uso de elementos flotantes. En sus diferentes salas de chat hay multitud de ejemplos de elementos con float CSS.
Clear CSS
El estilo «clear» se utiliza conjuntamente con float. Utilizamos este estilo cuándo queremos que elementos que tienen cerca un elemento flotante (mediante «float») dejen de alinearse junto a él.
Sus posibles valores son clear left (el elemento no permite flotantes a su izquierda ), clear right (el elemento no permite flotantes a su derecha ) o clear both (el elemento no permite flotantes a ningún lado).
Visualiza ahora un ejemplo de un elemento con el estilo “clear”:
Yohn dice
Hola, como puedo darle dos colores de fondo distintos a mi pagina web? Así como la tienes tu, con una división y cada uno con un color diferente: azul y blanco?
hazunaweb dice
Hola Yohn, en nuestro web, una de las varias clases de las DIVs responsables por generar el contenido de la cabecera es «bg-primary», por lo basta poner algo como:
.bg-primary {
background: #52c0cb;
}
Si tienes varias DIVs estructurando tu página web, podrás poner las colores que quieras.
frida dice
Tengo una duda sobre eso de «bg-primary», no entiendo:((
edo dice
ese color azul al que se refiere John corresponde a la cabecera de la web, que es una sección fija, y puede ser dinámica y cambiar según qué tipo de página. El color gris de fondo es el color de fondo del body, que corresponde al fondo de todo el sitio web, bg-primary se refiere al nombre de una clase que identifica a la cabecera de la sección ubicada en la parte superior de una página web. Todo esta charla no tiene sentido sino tienes conocimiento de css, que es una colección de códigos que permiten estilizar tu sitio web, debes empezar por eso para entender respecto a maquetación de sitios web.
AleGodoy dice
Es una clase que creó, la que identifica el div que corresponde al primer color seleccionado para el background, luego te sugiere que uses otro div con clase lo cual podría ser bg-secundary y a ese div darle background-color: #EFEFEF o el color en hexagesimal que tu desees.