Utilisation du flotteur CSS pour faire fonctionner DIV

L'attribut float de style CSS est utilisé pour définir la disposition flottante des objets d'étiquette (tels que : <div> boîte d'étiquette, <span> étiquette, <a> étiquette, <em> é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 également flotter lorsqu'il est traduit en chinois. Accédez au manuel float dans le manuel CSS correspondant pour en savoir plus sur les informations de base sur float.

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é).

répertoire du didacticiel flottant flottant

syntaxe flottante

application et utilisation flottantes

cas flottant flottant

css flottant autres applications

résumé CSS float

syntaxe float

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

Float:none Ne pas utiliser float

Float : gauche Flotteur vers la gauche

Float :droite Flotteur vers la droite

syntaxe float :

float : aucun gauche |droite

Valeur du paramètre :

aucun : L'objet ne flotte pas

gauche : L'objet flotte à gauche

droite : L'objet flotte à droite

Ensuite, nous expliquerons float à travers un exemple div+css Conseils d'utilisation.

Application et utilisation du flotteur

Float est utilisé pour définir les styles flottants des objets à gauche et à droite. Il peut réaliser ce dont nous avons besoin pour faire flotter les étiquettes DIV, SPAN et autres à gauche et à droite.

Syntaxe simple à utiliser

div{float:left} /* commentaire css : Définit l'objet div pour qu'il flotte vers la gauche (gauche) */

div{float :right} / * commentaire css : Définissez l'objet div pour qu'il flotte vers la droite (à droite) */

cas flottant css float

Nous mettons en place deux boîtes dans une boîte, une vers la à droite et un à 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 cases.

1. Extrait de code HTML principal :

<div class="div ">

<div class="div _left">Mise en page à gauche Flottant</div>

<div class="div _right">Mise en page flottante vers la droite</div>

<div class="clear">< div><!-- commentaire html : effacer float pour générer float-->

</div>

2. { width:400px;padding:10px;border:1px solid #F00}

.div _left{ float:left;width:150px;border:1px solid #00F;height:50px}

.div _right{ float:right;width:150px;border:1px solid #00F;height:50px}

.clear{ clear:both}

L'utilisation float de l'opération CSS DIV est le suivant Il y en a tellement, les amis qui en ont besoin peuvent les sauvegarder, et continuez à prêter attention aux autres mises à jour sur ce site.

Lecture connexe :

Comment définir la largeur minimale et la largeur maximale du CSS

Quelle est la fonction de la marge CSS

Comment faire des coins arrondis en CSS3

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!