CSS — 清除浮动,浏览器兼容,响应式布局辅助代码集合(持续更新)
1.清除浮动最佳办法:
.clear-fix { *overflow: hidden; *zoom: 1; }
.clear-fix:after { display: table; content: ""; width: 0; clear: both; }
第一行是专门用来清除IE6的浮动(前端那无法言说的痛),其中zoom是设置缩放比例的。
第二行需要在父级元素下面是指该属性
只要短短两行就可以轻松清除浮动,这也是得益于CSS3的 .after 伪元素,飘渺虚无但还真是存在的元素。
2. 清除浮动慎选:
float可以用清除浮动的各种办法来清除,但是position:absolute却不能被消除,不要滥用这个方法。
---------------------------------------------------------------------------------------------------------------------
3.块级元素和行级元素的差别:
块级元素的特点:
1.总是在新行上开始,占据一整行。 (div就是一个很典型的块级元素,虽然可以设置宽高,但是还是要占据一行。)
2.高度,行高以及外边距和内边距都可控制,但是普通情况下不能设置宽度,宽度与浏览器宽度相同。
3.它可以容纳内联元素和其他块元素。