Heim > Artikel > Web-Frontend > Tipps zum Löschen von Floats zwischen CSS-Elementen derselben Ebene
Tipps zum Löschen von Floats zwischen CSS-Elementen derselben Ebene
- 无忌哥哥Original
- 2018-06-29 09:21:552257Durchsuche
Linkes Float löschen: Auf der linken Seite dieses Elements dürfen keine schwebenden Elemente angezeigt werden, und es handelt sich um ein Blockelement. Es kann nur an den Anfang fallen der nächsten Zeile und beginnen Sie mit der Anzeige.
clear: left;
Clear right float: Wie oben dürfen schwebende Elemente nicht auf der rechten Seite des Elements angezeigt werden kann nur in einer weiteren Zeile unterhalb des rechten schwebenden Elements angezeigt werden. Der untere Rand ist der Ausgangspunkt und beginnt mit der Anzeige
klar: rechts;
Wenn schwebende Elemente sowohl auf der linken als auch auf der rechten Seite des Elements verboten sind, können Sie die folgende Abkürzung verwenden
clear:both;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>6.同级元素之间的清除浮动的技巧</title>
<style type="text/css">
.box1 {
width:200px;
height: 200px;
background-color: lightskyblue;
/*设置左浮动*/
float:left;
}
.box2 {
width:250px;
height: 250px;
background-color: lightgreen;
/*设置右浮动*/
float:right;
}
.box3 {
width:300px;
height: 300px;
background-color: lightcoral; /*珊瑚色*/
}
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
</body>
</html>Das obige ist der detaillierte Inhalt vonTipps zum Löschen von Floats zwischen CSS-Elementen derselben Ebene. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!