DIV+CSS布局
1 div和span
DIV和SPAN在整个HTML标记中，没有任何意义，他们的存在就是为了应用CSS样式
DIV和SPAN的区别在于，SPAN是内联元素，DIV是块级元素
2 盒模型
margin 盒子外边距
padding 盒子内边距
border 盒子边框宽度
width 盒子宽度
height 盒子高度
3 布局相关的属性
3.1 position 定位方式
正常定位 relative
根据父元素进行定位 absolute
根据浏览器窗口进行定位 fixed
没有定位 static
继承 inherit
3.2 定位
离页面顶点的距离 left（左），right（右），top（上），bottom（下）
3.3 z-index 层覆盖先后顺序（优先级）
3.4 display 显示属性
display:none 层不显示
display:block 块状显示，在元素后面换行，显示下一个元素
display:inline 内联显示，多个块可以显示在一行内
3.5 float 浮动属性
left 左浮动
right 右浮动
3.6 clear 清除浮动
clear:both
3.7 overflow 溢出处理
hidden 隐藏超出层大小的内容
scroll 无论内容是否超出层大小都添加滚动条
auto 超出时自动添加滚动条
4 兼容问题及高效开发工具
4.1 兼容性测试工具
IE Tester
Multibrowser
4.2 常用的浏览器
Firefox
Google chrome
opera
4.3 高效的开发工具
4.3.1 轻级的
Notepad++
sbulime Text
记事本 根据自己的需要来选择
4.3.2 重量级的
WebStorm
Dreamweaver
4.4 网页设计工具
fireworks
photoshop
5 判断IE的方法 条件注释只在IE浏览器
5.1 条件判断格式
<!--[if 条件 版本]> 那么显示 <![endif]-->
5.2 不等于
[if !IE 8] 除了IE8都可以显示
5.3 小于
[if it IE 5.5] 如果IE浏览器版本小于6的显示
5.4 大于
[if gt IE 5] 如果IE浏览器版本大于5的显示
5.5 小于或等于
[if lte IE 6] 如果IE浏览器版本小于6的显示
5.6 大于或等于
[if gte IE 7] 如果IE浏览器版本小于7的显示
5.7 大于和小于之间
[if (gt IE 5)&(it IE 7) 如果IE浏览器版本大于IE5小于7的显示
5.8 或
[if (IE 6)|(IE 7)] 如果是IE6或者IE7显示
5.9 仅
<!--[if IE 8]> 如果是IE8，就只显示IE8
6 《DIV+CSS网页布局实战》
先分析，再切图，然后搭建框架，慢慢的循序渐进，下一步解决兼容，最后完成
本文转自 拉考的考拉 51CTO博客，原文链接:http://blog.51cto.com/lakaodekaola/1967987
