css的clear属性

html-css020

css的clear属性,第1张

clear 属性规定元素的哪一侧不允许其他浮动元素

在 CSS1 和 CSS2 中，这是通过自动为清除元素（即设置了 clear 属性的元素）增加上外边距实现的。在 CSS2.1 中，会在元素上外边距之上增加清除空间，而外边距本身并不改变。不论哪一种改变，最终结果都一样，如果声明为左边或右边清除，会使元素的上外边框边界刚好在该边上浮动元素的下外边距边界之下

<html>

<head>

<style type="text/css">

img

{

float:left

clear:both

}

</style>

</head>

<body>

<img src="1.png" />

<img src="2.png" />

</body>

</html>

clear属性用来指定的浮动元件不允许浮动该哪一侧；它设置或返回元素相对于浮动对象的位置。而"clear: both"用于设置在左右两侧均不允许浮动元素。

原文地址： CSS规则"clear: both"有什么作用？

当不需要与指定元素相关的任何元素在左右浮动，并且仅在下面显示时，就可以使用该"clear: both"规则。该规则还表明没有其他元素占用左右两边的空间。

语法：

示例：

效果图：

浏览器支持：

●　Google Chrome

●　Internet Explorer

●　Firefox

●　Opera

●　Safari

推荐阅读：

java基础教程

layui框架

go语言教程

css中清除浮动可用clear属性，该属性定义了元素哪边不允许出现浮动，可选的常用的值有:left、right、both等，通常写成clear:both即该元素两边都不允许出现浮动，这样即可清除浮动。

另外，给父级元素定义overflow:hidden这样也能清除浮动。