DIV+CSS布局

DIV+CSS布局

1. div和span

   • div和span在整个HTML标记中，没有任何意义，它们的存在就是为了应用CSS样式。
   • div和span的区别在于，span是内联元素，div是块级元素。
     
     

2. 盒模型

   • margin (外边距)
   • padding (内边距)
   • border (边框宽度)
   • width (宽度，块元素)
   • height (高度，块元素)

3. 布局相关的属性

   • position (定位方式)

     1. relative (正常定位)
     2. absolute (根据父元素定位)
     3. fixed (根据浏览器窗口定位, 广告啥的)
     4. static (没有定位)
     5. inherit

   • 定位

     top、left、bottom、right离页面顶点的距离。

   • z-index (层优先级)

     数字大的在上层。

   • display (显示属性)

     1. none (层不显示)
     2. block (块状显示，在元素后面换行，显示下一元素，e.g.div)
     3. inline (内联显示，多个块显示在一行，e.g.span)

   • float (浮动属性)

     1. left
     2. right

   • clear (清除浮动)

     clear: both

   • overflow (溢出处理)

     1. hidden 隐藏超出部分
     2. scroll 无论是否超出均加滚动条
     3. auto 超出时添加滚动条