分享更有价值
被信任是一种快乐

css中用于清除浮动的属性是什么

文章页正文上

本文小编为大家详细介绍“css中用于清除浮动的属性是什么”,内容详细,步骤清晰,细节处理妥当,希望这篇“css中用于清除浮动的属性是什么”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。 css中用于清除浮动的属性有两种:1、clear属性,可定义元素哪边不允许出现浮动,通常写成“clear:both;”表示该元素两边都不允许出现浮动,这样即可清除浮动。2、overflow属性,给父级元素定义“overflow:hidden;”样式也能清除浮动。本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。什么是CSS清除浮动?在非IE浏览器(如Firefox)下,当容器的高度为auto,且容器的内容中有浮动(float为left或right)的元素,在这种情况下,容器的高度不能自动伸长以适应内容的高度,使得内容溢出到容器外面而影响(甚至破坏)布局的现象。这个现象叫浮动溢出,为了防止这个现象的出现而进行的CSS处理,就叫CSS清除浮动。引用W3C的例子,news容器没有包围浮动的元素。sometext清除浮动方法方法一:使用带clear属性的空元素在浮动元素后使用一个空元素如sometext优点:简单,代码少,浏览器兼容性好。缺点:需要添加大量无语义的html元素,代码不够优雅,后期不容易维护。方法二:使用CSS的overflow属性给浮动元素的容器添加overflow:hidden;或overflow:auto;可以清除浮动,另外在 IE6 中还需要触发 hasLayout ,例如为父元素设置容器宽高或设置 zoom:1。在添加overflow属性后,浮动元素又回到了容器层,把容器高度撑起,达到了清理浮动的效果。sometext方法三:给浮动的元素的容器添加浮动给浮动元素的容器也添加上浮动属性即可清除内部浮动,但是这样会使其整体浮动,影响布局,不推荐使用。方法四:使用邻接元素处理什么都不做,给浮动元素后面的元素添免费云主机、域名加clear属性。sometext方法五:使用CSS的:after伪元素结合 :after 伪元素(注意这不是伪类,而是伪元素,代表一个元素之后最近的元素)和 IEhack ,可以完美兼容当前主流的各大浏览器,这里的 IEhack 指的是触发 hasLayout。给浮动元素的容器添加一个clearfix的class,然后给这个class添加一个:after伪元素实现元素末尾添加一个看不见的块元素(Block element)清理浮动。sometext通过CSS伪元素在容器的内部元素最后添加了一个看不见的空格”020″或点”.”,并且赋予clear属性来清除浮动。需要注意的是为了IE6和IE7浏览器,要给clearfix这个class添加一条zoom:1;触发haslayout。读到这里,这篇“css中用于清除浮动的属性是什么”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注云技术行业资讯频道。

相关推荐: 用jquery写代码能不能触发事件

今天小编给大家分享一下用jquery写代码能不能触发事件的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这免费云主机、域名篇文章后有所收获,下面我们一起来了解一下吧。 用jquery写代码能触…

文章页内容下
赞(0) 打赏
版权声明:本站采用知识共享、学习交流,不允许用于商业用途;文章由发布者自行承担一切责任,与本站无关。
文章页正文下
文章页评论上

登录

找回密码

注册