CSS 笔记(一)

学习了张鑫旭大神的浮动教程，记一下笔记。

浮动最开始是为了文字环绕图片效果。

浮动会破坏父元素的包裹。

清除浮动：在父元素加上clearfix(after不兼容ie6 7，zoom为ie6 7下方法)

clearfix:after {
  content:"";
  display:table;
  clear:both;    
}
clear {
  zoom:1;
}

浮动可以去空格化。

 

流体化布局，普通：

左侧 { width: 56px; float: left; }   

右侧 { margin-left: 76px; }

 

流体化布局 ，左右自适应宽度变化：

左侧 { float: left; margin-right: 20px; }

右侧 { display: table-cell; *display: inline-block; width: 2000px; *width: auto; }