Cómo flotadores claras (clearfix) el uso de CSS?

En este tutorial, vamos a aprender sobre la clearfix en CSS – A continuación, vamos a aprender cómo podemos limpiar los flotadores de los elementos usando CSS?

Introducción:

se ocupan de diversos elementos en una página web o una página web a veces puede llegar a crear muchos problemas por lo tanto, uno debe ser consciente de las muchas propiedades, trucos o maneras de hacer frente a esos problemas. No queremos que nuestro sitio web o una página web para aparecer como en mal estado o que no responde a los usuarios, por lo tanto, la fijación de cada problema o asunto se vuelve muy importante. Aunque es bastante aceptable que uno no puede conocer todas las propiedades involucradas en el sitio web o el desarrollo de páginas web, por lo tanto, hay que crear un hábito de mirar las cosas class En caso de duda o está seguro de lo que hay que hacer para resolver un problema particular. Este artículo puede ayudar a muchos de estos sitios web o los desarrolladores de páginas web por ahí para hacer frente a estos problemas y también ayudarles a aprender algo que no podrían haber sabido antes o pueden haber conocido, pero se han olvidado.

informativa:

Como se ha dicho en la sección anterior que se ocupan de diversos elementos puede llegar a ser muy difícil, por lo tanto, en este artículo gira en torno a un tal aspecto de los elementos que nos encontramos con regularidad, mientras que el desarrollo de una página web o en la web página y que deben ser activamente consciente de este término, así, el término está flotando. Nosotros usamos la propiedad flotante muy a menudo for la colocación de diversos elementos a través de nuestra página web, for ejemplo, fijamos un elemento a for derecha, hemos creado una imagen a la izquierda y float float varios otros fines. Pero todos sabemos lo que la propiedad flotante se utilizó for ¿verdad? Entonces, ¿cómo este artículo va a ayudarnos? La pregunta que hay que han afectado en este momento, for que sigue leyendo y te for entender el propósito del artículo!

Solución:

A veces nos enfrentamos a un problema que muchos elementos después de una flota tenderán a fluir alrededor de él. Si no tiene que hacer frente a este tipo de problema aún entonces es posible que en el futuro. Entonces, ¿cómo podemos solucionar este problema? Bueno, la respuesta es clearfix . clearfix es una propiedad CSS que se utiliza para resolver o implícita sobre todo este tipo de problema. Esta propiedad o método es muy fácil de implementar también.

finally ejemplo:

Hay momentos en que tenemos los elementos que son más altas que los elementos que lo contienen, por lo tanto, para resolver este problema utilizamos overflow: auto y agregarlo al elemento que contiene.

Sintaxis:

    Element{
overflow:auto;
}

Ejemplo:

<!DOCTYPE html>
<html>
<head>
<style>
div {
border: 5px solid #ccc;
padding: 5px;
}
.clearfix {
overflow: auto;
}
.img {
float: right;
}
</style>
</head>
<body>
<div class="clearfix">
<img class="img" src="img_forest.jpg" width="160" height="150"/>
IncludeHelp is a learning wesbite for students. IncludeHelp is a learning wesbite for students.
IncludeHelp is a learning wesbite for students.
</div>
</body>
</html>

salida

How to clear floats (clearfix) using CSS? - 4

En el ejemplo anterior, la imagen no desbordamiento su recipiente exterior.

Nota: El overflow: auto sólo funcionará así como For como usted tiene control sobre sus márgenes y rellenos, por lo tanto, asegúrese de que sus márgenes y rellenos son correcto de lo contrario es posible que vea las barras de desplazamiento.


Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *