css clear的作用是清除浮动。浮动元素可以让文本环绕在其周围，但是也可能导致一些布局问题。通常情况下，父元素的高度无法
自动包含浮动元素。这就导致了子元素的
内容会溢出到父元素之外，从而破坏了整个
页面的布局。而使用clear可以防止这种情况的发生，保证整个
页面的布局结构正确。
在CSS中，clear
属性有4种值可以使用：
clear:none：浮动元素可以在其周围的文本中
显示，而不清除浮动。
clear:left：所有左侧浮动元素都将被清除。
clear:right：所有右侧浮动元素都将被清除。
clear:both：所有浮动元素都将被清除。
格式：
pre {
clear: none | left | right | both;
}
例如：假如有
一个带浮动子元素的div，下面是CSS
代码实现清除浮动：
div {
border: 1px solid #000;
overflow: auto;
}
div p {
float: left;
margin: 10px;
}
这是一个带浮动子元素的div。
@H_
404_3@
这是带浮动子元素的第二个div。
上述
代码会使字体环绕在浮动的div内，但当
页面的高度不够时，字体会从div外
显示。
在这种情况下，我们可以通过在容器上使用clear类来消除浮动，避免在下面的元素中
显示。下面是
代码实现：
pre {
clear:both;
display:block;
content:"";
}
这样，当容器div的高度不够时，clear类可以平衡左右浮动元素的高度，并使其
父容器包含所有子元素，以保持整个
页面的结构和布局正确。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
