|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
表现和内容相分离。将设计部分剥离出来放在一个独立样式文件中,你可以减少未来网页无效的可能。
破洛洛文章简介:清算浮动有良多种体例,像利用br标签自带的clear属,利用元素的overflow,利用空标签来设置clear:both等等。但思索到兼容成绩和语义化的成绩,一样平常我们城市利用以下代码来清算浮动。
清算浮动有良多种体例,像利用br标签自带的clear属,利用元素的overflow,利用空标签来设置clear:both等等。但思索到兼容成绩和语义化的成绩,一样平常我们城市利用以下代码来清算浮动。
/*清算浮动*/
.clearfix:after{
visibility:hidden;
display:block;
font-size:0;
content:"";
clear:both;
height:0;
}
.clearfix{
zoom:1;
}
其道理是,在「初级」扫瞄器中利用:after伪类在浮动块前面加上一个非display:none的不成见块状内容来,并给它设置clear:both来清算浮动。在ie6和7中给浮动块增加haslayout来让浮动块撑高并一般影响文档流。
下面的代码应当是如今支流的清算浮动体例。如今付出宝就利用如许的体例。而如今,NicolasGallagher给出了一个更简便的计划:
.cf:before,.cf:after{
content:"";
display:table;
}
.cf:after{
clear:both;
}
.cf{
zoom:1;
}
道理仍是一样的。利用:after伪类来供应浮动块后的clear:both。分歧的是,埋没这个空缺利用的是display:table。而不是设置visibility:hidden;height:0;font-size:0;如许的hack。
值得注重的是这里中的:before伪类。实在他是来用途理top-margin边折叠的,跟清算浮动没有多年夜的干系。但由于浮动会创立blockformattingcontext,如许浮动元素上的另而一元素上假如恰好有margin-bottom而这个浮动元素恰好有margin-top的话,应当让他们不折叠(固然这类情形其实不罕见)。
</p>
Div全称division意为“区分”使用DIV的方法跟使用其他tag的方法一样。 |
|