夏蝉秋鸣の博客
HTML&CSS&JS&JQ&VUE

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.它可以容纳内联元素和其他块元素。

posted @ 2017-04-26 16:29  夏蝉秋鸣  阅读(217)  评论(0编辑  收藏  举报