html中的clear是什么意思

html中,clear的意思是清除,只需要给浮动元素设置“clear:属性值”即可。clear属性定义了元素的哪边不允许出现浮动元素。会在元素外边距之上增加清除空间,而外边距本身并不改变。

html中的clear是什么意思插图

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

css中clear的作用是清除元素的浮动效果。

在 CSS1 和 CSS2 中,这是通过自动为清除元素(即设置了 clear 属性的元素)增加上外边距实现的。在 CSS2.1 中,会在元素上外边距之上增加清除空间,而外边距本身并不改变。

不论哪一种改变,最终结果都一样,如果声明为左边或右边清除,会使元素的上外边框边界刚好在该边上浮动元素的下外边距边界之下。

clear属性值:

left 在左侧不允许浮动元素。

right 在右侧不允许浮动元素。

both 在左右两侧均不允许浮动元素。

none 默认值。允许浮动元素出现在两侧。

inherit 规定应该从父元素继承 clear 属性的值。

示例:

<html>
<head>
<style type="text/css">
div {
float: left;
margin: 20px;
}
.three{
clear: both;
}
</style>
</head>
<body>
<div>
<img src="https://www.php.cn/images/1.jpg" />
</div>
<div>
<img src="https://www.php.cn/images/2.jpg" />
</div>
<div class="three">
<img src="https://www.php.cn/images/3.jpg" />
</div>
</body>
</html>

效果:

YS_H_7PJ)4ASJ%BCK{{V)$O.png

推荐学习:html视频教程

以上就是html中的clear是什么意思的详细内容,更多请关注811轩轩资源网其它相关文章!

本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。如有需求,建议购买正版!如果源码侵犯了您的利益请留言告知!!
优质资源共享平台-811轩轩资源 » html中的clear是什么意思

发表评论