div+css布局

1.div 和 span（为了应用CSS样式）

　　span是内联样式（只占内容存在的那一部分）

　　div是块级元素（占一整行）

2.盒模型

　　margin：盒子外边距

　　padding：盒子内边距

　　border：盒子边框宽度

　　width：盒子宽度

　　height：盒子高度

3.布局的相关属性

　　1）position定位方式

　　　　正常定位：relative

　　　　根据父窗口进行定位：absolute

　　　　根据浏览器窗口进行定位：fixed （常用于做浮动窗口，相对于浏览器位置一直保持不变）

　　　　没有定位：static

　　　　继承：inherit

　　2）定位

　　　　离页面定点的距离：left、right、top、bottom

　　3）层覆盖先后顺序（优先级）

　　　　z-index：用数字表示，默认为0，数字越大越向上

　　4）显示属性：display

　　　　none：层不显示

　　　　block：块状显示，在元素后面换行，显示下一个元素

　　　　inline：内联显示，多个块可以显示在一行内

　　　　（内联元素不能定义宽度，可以用block和inline两个属性实现div和span的相互转换）

　　5）浮动属性：float

　　　　left：左浮动

　　　　right：右浮动

　　6）清除浮动

　　　　clear：both

　　7）溢出处理：overflow

　　　　hidden：隐藏超出层大小的内容

　　　　scroll：无论内容是否超出层大小都添加滚动条

　　　　auto：超出时自动添加滚动条

4.使网页定格居中显示：

body{

　　margin：0 auto；

}

去掉所有margin、padding

*{margin：0 padding：0}

5.兼容问题

　　1）兼容性测试工具

　　　　IE Tester、Multibrowser

　　2）常用的浏览器

　　　　Google chrome、Firefox、opera

　　3）高效的开发工具

　　　　Notepad++、sbulime Text、记事本

　　　　WebStorm、Dreamweaver

　　4）网页设计工具

　　　　fireworks、photoshop