您好,欢迎访问一九零五行业门户网

有关清除浮动的问题,求解释~~_html/css_WEB-ITnose

.clear{clear:both;}

.clear{ clear:both;}.clear:after{ clear: both; content: ; display: block;}
第一个我知道什么意思但后面那个是啥意思啊,我发现将后面那个应用去清除ul中li的浮动的时候效果好明显。
看下面我的css代码
.bookrack_content_ul { width: 100%; background:url(../images/indexpage/ul_bg.png) repeat;}.bookrack_content_li { float: left; margin-top:36px; margin-left:37px; margin-bottom:11px;}
效果:
如果不清除浮动那给ul添加的背景只会出现一排,li的内容长度超过100%的时候就会换行嘛,那下面那行就木有背景。清除后,浏览器怎么缩放,每个li都是有背景的。
回复讨论(解决方案) 如果不清除浮动,ul不能够完全“包裹住”浮动的子元素li。浮动的li会脱离文档流,而不被ui包裹。
如果ul使用了清除浮动,则ul,可以将浮动的子元素li“包裹住”,所以换行后li还会有背景。
如果不清除浮动,ul不能够完全“包裹住”浮动的子元素li。浮动的li会脱离文档流,而不被ui包裹。
如果ul使用了清除浮动,则ul,可以将浮动的子元素li“包裹住”,所以换行后li还会有背景。
那能不能直接使用clear:both呢,为啥要使用后面那个有伪类的东东
如果不使用伪类,直接使用clear:both的话,你可以在ui中,即li的同级中添加一个空的li,在这个空的li上使用clear:both,可以达到同样的效果。就好像如下代码:
aaa aaa aaa


在ul上,使用伪类的方式,即相当于在ul中默认添加了一个元素,使用clear:both
aaa aaa aaa


如果不使用伪类,直接使用clear:both的话,你可以在ui中,即li的同级中添加一个空的li,在这个空的li上使用clear:both,可以达到同样的效果。就好像如下代码:
aaa aaa aaa


在ul上,使用伪类的方式,即相当于在ul中默认添加了一个元素,使用clear:both
aaa aaa aaa


谢谢
其它类似信息

推荐信息