Comment écrire du CSS flottant à gauche

L'attribut float de style CSS est utilisé pour définir la disposition flottante des objets d'étiquette (tels que : dc6dce4a544fdca2df29d5ac0ea9906b boîte d'étiquette, 45a2772a6b6107b401db3c9b82c049c2 étiquette, 3499910bf9dac5ae3c52d5ede7383485 étiquette, 907fae80ddef53131f3292ee4f81644b étiquette et autres étiquettes HTML. ), Flottant est ce que nous appelons les objets d'étiquette flottant vers la gauche (float:left) et flottant vers la droite (float:right).

Que signifie flotter ?

float signifie flotter, et cela signifie aussi flotter lorsqu'il est traduit en chinois.

Le rôle de float

Définissez float (float) via CSS pour laisser le bloc de calque de style div flotter vers la gauche ou la droite (penché).

Float est souvent suivi des valeurs d'attribut left, right, none

Float:none Ne pas utiliser flottant

Float:left Flotte vers la gauche

Float:right Flotteur droit

syntaxe float :

float : aucun gauche |droit

Valeur du paramètre :

aucun : L'objet ne flotte pas

gauche : L'objet flotte à gauche

droite : L'objet flotte à droite

Cas :

Nous avons configuré une boîte. Il y a deux boîtes flottantes, une à droite et une à gauche. Afin de voir intuitivement l'effet de mise en page flottante CSS, nous définissons une certaine largeur, hauteur et bordure pour les deux boîtes. .

1. Extrait de code HTML principal :

<div class="divcss5"> 
    <div class="divcss5_left">布局靠左浮动</div> 
    <div class="divcss5_right">布局靠右浮动</div> 
    <div class="clear"></div><!-- html注释：清除float产生浮动 --> 
</div>

2、css代码片段：
.divcss5{ width:400px;padding:10px;border:1px solid #F00} 
.divcss5_left{ float:left;width:150px;border:1px solid #00F;height:50px} 
.divcss5_right{ float:right;width:150px;border:1px solid #00F;height:50px} 
.clear{ clear:both}

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!