Problème de style en ligne
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Mise en page sur une seule colonne</title>
< ;style>
corps{
;
width : 90 % ;
/*height : 500px ; :5px auto /*C'est l'abréviation, le remplissage supérieur et inférieur est de 5 px, les éléments automatiques gauche et droit sont centrés ; est sur le centrage horizontal de la partie du bloc*/
}
.main .left{
width: 30%;
height: 500px;
background-color: pink;
float: left;/*Je veux flotter à gauche pour en haut, éloignez-vous du flux de documents et déplacez la ligne du bas vers le haut*/
}
.main .right{
width: 69%;
height: 500px;
background-color: deeppink;
float: right;/ *L'effet de droite et de gauche est le même. Après le flottement, un nouveau flux de documents est formé*/
}
.footer{
. 0 auto;
}
.clear{
clear : les deux;
}
</style>
</head>
<body>
<div class="header" ></div>
<div class="main">
<div class="left"></div>
<div class="right"></div> clear"></div>
</div>
<div class="footer"></div>
</body>
</html>
Pourquoi utiliser .main .left
lors de la définition du style .left dans le style et utilisez .clear directement lors de la définition du style .clear
