Html style="clear:both" 有什么用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1012131/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What is the use of style="clear:both"?
提问by thomasbabuj
I happened to see a divwhich had the style clear:both! What is the use of clearin style?
我碰巧看到一个div有风格的clear:both！什么是使用clear的style？
<div style="clear:both">
回答by RichieHindle
clear:bothmakes the element drop below any floated elements that precede it in the document.
clear:both使元素低于文档中位于它之前的任何浮动元素。
You can also use clear:leftor clear:rightto make it drop below only those elements that have been floated left or right.
您还可以使用clear:left或clear:right使其仅落在那些向左或向右浮动的元素下方。
+------------+ +--------------------+
| | | |
| float:left | | without clear |
| | | |
| | +--------------------+
| | +--------------------+
| | | |
| | | with clear:right |
| | | (no effect here, |
| | | as there is no |
| | | float:right |
| | | element) |
| | | |
| | +--------------------+
| |
+------------+
+---------------------+
| |
| with clear:left |
| or clear:both |
| |
+---------------------+
回答by Paul Dixon
Just to add to RichieHindle's answer, check out Floatutorial, which walks you through how CSS floating and clearing works.
只需添加到RichieHindle的回答，请Floatutorial，这将引导您完成CSS浮动和清算是如何工作的。
回答by imdad
When you use float without width, there remains some space in that row. To block this space you can use clear:both;in next element.
当您使用没有宽度的 float 时，该行中会保留一些空间。要阻止此空间，您可以clear:both;在下一个元素中使用。
