css中clearit什么意思

CSS中的clear属性可以用来解决由浮动元素引起的布局问题。而clear属性可以取任何一个值，但其中比较常用的是clear: left; clear: right; clear: both;和clear: none;。其中我们最常见的是：clear: both;和clear: left;。

.clear {
  clear: both;
}

当我们在网页中使用浮动元素时，我们可能会发现浮动元素会让它们的外层容器高度为0，这是因为浮动元素不会占据文档流造成的。这时，就可以使用clear属性来清除浮动造成的影响。

clear: left;的意思是只清除左侧浮动元素的影响；clear: right;的意思是只清除右侧浮动元素的影响；clear: both;的意思是清除左右两侧浮动元素的影响。

#container {
  width: 960px;
  margin: 0 auto;
  background-color: #ccc;
  overflow: hidden;
  /*这里使用overflow:hidden是为了让外层容器撑开*/
}
.float-left {
  float: left;
  width: 300px;
  height: 200px;
  background-color: #f00;
}
.float-right {
  float: right;
  width: 300px;
  height: 200px;
  background-color: #0f0;
}

<div id="container">
  <div class="float-left"></div>
  <div class="float-right"></div>
  <div class="clear"></div>
</div>

在以上代码中，我们定义了两个左右浮动的元素，这里我们选择使用clear: both;来清除两侧元素的影响，这样容器就能够撑开，让两侧浮动元素不会将外层容器撑爆。