Maison > Article > interface Web > css qu'est-ce que float
css qu'est-ce que float
- 青灯夜游original
- 2021-04-02 17:17:441989parcourir
En CSS, le flottement est une méthode permettant de retirer un élément du flux de documents, provoquant le déplacement de l'élément vers la gauche ou la droite en fonction de la valeur de float, et les éléments autour de lui seront également réorganisés jusqu'à son emplacement extérieur. bord jusqu'à ce qu'il touche la bordure de la boîte conteneur ou d'une autre boîte flottante.
L'environnement d'exploitation de ce tutoriel : système Windows 7, version CSS3&&HTML5, ordinateur Dell G3.
Le flottement est une méthode permettant de retirer un élément du flux du document, de le déplacer vers la gauche ou la droite et de réorganiser les éléments autour de lui.
La signification de flottant : l'élément avec l'ensemble d'attributs flottants s'éloignera du contrôle du flux standard ordinaire et se déplacera vers la position spécifiée dans son élément parent si l'élément de niveau bloc est placé dans un. ligne, le flottant se détachera du flux standard. Il n'occupe pas de position et affectera le flux standard. Le flottement ne peut que flotter à gauche et à droite, pas de haut en bas.
Le flottement est une méthode de mise en page très utile, qui peut modifier l'ordre dans lequel les objets de la page avancent et reculent. L’avantage est que cela simplifie la mise en page du contenu et offre une bonne évolutivité.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
img
{
float:right;
}
</style>
</head>
<body>
<p>在下面的段落中，我们添加了一个 <b>float:right</b> 的图片。导致图片将会浮动在段落的右边。</p>
<p>
<img src="logocss.gif" style="max-width:90%" style="max-width:90%" / alt="css qu'est-ce que float" >
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
</p>
</body>
</html>
(Partage vidéo d'apprentissage : tutoriel vidéo CSS)
Caractéristiques flottantes des éléments :
1. Les éléments flottants s'éloignent du flux de documents standard et suppriment les restrictions des éléments au niveau du bloc et des éléments en ligne
2. Les éléments flottants ont pour effet de coller les uns aux autres. ne suffit pas, une erreur apparaîtra. Retour à la ligne automatique
3. Bien que les éléments flottants soient séparés du flux de document standard, ils ne sont pas séparés du flux de texte et apparaîtront entourés de mots
Les conséquences du flottement :
(1) Étant donné que l'élément flottant est hors du flux de documents, la hauteur de l'élément parent ne peut pas être étendue, ce qui affecte les éléments au même niveau que l'élément parent
(2) Au même niveau que l'élément flottant Les éléments non flottants le suivront, car l'élément flottant se détache du flux documentaire et n'occupe pas sa position d'origine
(3) Si l'élément flottant n'est pas le premier élément flottant, les éléments qui le précèdent doivent également être flottants, sinon cela affectera facilement l'affichage structurel de la page
, donc flotte. doivent être effacés. Alors comment effacer le flotteur ? Lecture recommandée « Comment effacer les flottants en CSS ? Introduction à 3 méthodes》
Pour plus de connaissances liées à la programmation, veuillez visiter : Vidéo de programmation ! !
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!