css3的盒模型：
盒子的大小由：width+padding+border来决定
box-sizing:content-box; //就是设置我们经常使用的盒模型 w3c推荐使用
****现在的css3有了新特性：box-sizing:border-box 可以设置padding border不撑开盒子
****也就是说 盒子的大小width padding和border是包含在width里面的 实际的宽度就是width了 就不要再计算属性了
盒子阴影属性：
先回顾一下文字阴影吧：text-shadow:5px 5px 10px rgba(0,0,0,0.4) inset //水平距离 垂直距离 模糊距离 模糊的颜色
***盒子的阴影属性：box-shadow:水平距离 垂直距离 模糊距离 模糊大小 模糊颜色 内外阴影（inset内阴影 外阴影可以不写）
关于布局：
有三种布局：标准流（泡在地上） 浮动（浮在空间） 定位（浮在空中，想去任何地方都行）
什么是浮动：设置浮动属性的元素会脱离标准的普通流的控制。移动到其父元素指定位置的过程
就是会飘在标准流的上面
关于浮动的基本语法：
1.float: left(元素向左浮动) right(元素向右浮动) none(元素不浮动 默认值)
2.没有居中对齐浮动语法 margin：0 auto 就是让盒子居中对齐了
3.浮动元素总是找他最近的父亲元素进行对齐，但是不会超出内边距的范围 padding也不会超出的
（子盒子的浮动是不会影响父盒子的padding和margin的值的）
4.如果两个盒子都浮动，则盒子会顶对齐 如果第二个盒子浮动第一个不浮动的话 则会显示底对齐
总结：如果需要盒子在一行对齐 里面的盒子必须都得浮动 否则的就不会对齐（因为没有设置浮动 就是块级元素单独占据一行）
5.块级元素添加浮动元素之后 具有行内块特性（有宽度和高度 盒子的大小是有内容决定的） 就是隐式的转换了
主要作用：可以用来做文字环绕图片的效果 但是最最最经常使用的是把块级元素并排展示 这样就能够得到想要的位置
内幕特性：就是用标准流的盒子进行包裹 然后里面浮动相应的盒子即可（一定使用标准流的盒子来进行包裹）
清除浮动：
第一种方法：在浮动元素末尾添加过一个空的标签 <div class="clear"></div>
.clear {
clear: both;
}
第二种方法：给浮动的元素设置
.box1 {
/*overflow: hidden; hidden|auto|scroll 都可以清除这是清除浮动的第二种方法 触发BFC BFC 可以清除浮动*/
}
第三种方法：给浮动元素进行设置
第四种方法：给浮动元素设置
