盒子阴影
1、定义：向div元素添加影子
2、使用：四个属性值 水平阴影 垂直阴影 影子模糊距离 影子的颜色
box-shadow: 60px 30px 10px #ff0000;
浮动
1、标准流（文档流）：元素按部就班按照自身的特性排列 2、浮动定义：元素会脱离标准普通流的控制，移动到指定位置的过程 3、使用： (1)左浮动：float：left (2)右浮动：float：right
浮动造成影响
(1)浮动后的元素会脱离标准流，漂浮在其他没有浮动的盒子上边 (2)浮动后的两个块状元素会在同一行显示 (3)浮动后的元素不占有原来的位置 (4)浮动后的元素不会超出父元素的范围 (5)浮动后的元素自动的转化为行内块元素 (6)浮动后的元素不超过父元素的内边距
清除浮动
1、定义：清除浮动：并不是清除浮动，而是清除浮动所带来的影响
2、为什么要清除浮动？
①浮动后的元素不会撑开的父元素的高度，因为浮动是不占位置的
3、如何清除浮动？
①额外标签法：在浮动元素的后边加上标签
（1)<div style="clear: left;"></div>
（2)清除左浮动 clear: left
（3)清除右浮动 clear: right
（4)清除左右浮动 clear: both
（5)优点：通俗易懂，书写方便
（6)缺点：添加了额外的标签，结构化差
②overflow属性：在父元素中添加
（1)overflow: hidden;
（2)overflow: scroll;
（3) overflow: auto;
（4)优点：但是代码简洁
（5)缺点： 盒子中多余的内容会被隐藏掉
③使用after伪元素清除浮动：给父元素添加
（1).clearfix::after { content: ' '; display: block; clear: both; }
（2)优点：符合闭合浮动思想 结构语义化正确
（3)缺点：IE6-7不支持:after
④双伪元素清除浮动:给父元素添加after以及before伪元素
（1).clearfix::after, .clearfix::before { content: '';display: table;clear: both; }
（2) 优点：代码简洁
（3)缺点：IE6-7不支持:after
版心与布局流程
1、版心定义：版心：网页中主体内容所在的区域
2、布局流程：
(1)确定页面的版心（可视区）。
(2)分析页面中的行模块，以及每个行模块中的列模块。
(3)制作HTML结构 。
(4)CSS初始化，然后开始运用盒子模型的原理，通过DIV+CSS布局来控制网页的各个模块。
3、概括布局流程
由外到内、由大到小