盒模型：

垂直的相邻外边距会重叠只取最大值

子元素设置margin 和父元素相邻会给父元素

让父元素不被传递 则可以给父元素设置一个边框或内边距

二.

浏览器默认样式：  margin padding

内联元素盒模型：

1.不能设置宽高

2.可以水平垂直内边距 不会影响布局

3.可以设置边框

4.可以设置水平外边距 相邻两个不重叠

三

display：

1.内联元素变成块元素：block

2.将一个元素作为内联元素：inline

3.将一个元素设置为行内块元素：inline-block

4.隐藏元素：none

visibility：

1.设置元素是否可见 visible是（默认） hidden不显示

2.消失后占据位置

四.

overflow：

处理溢出的类容

1.Visible 默认 不做处理

2.hidden 溢出内容被剪切不会被显示

3.scroll 以滚动条显示溢出

4.auto 根据需要添加滚动条

五.

文档流：

处于页面最底层的位置

元素在文档流的特点：

1.块元素独占一行 自上而下排列

2.块元素宽带默认100%

3.块元素的高度默认

4.内联元素依次排列 默认被类容撑开

六

浮动：floa

1.元素立即脱离文档流 它下边的元素会向上移动

2.元素浮动后会向页面左上或右上漂浮 直到遇到父元素或者其他浮动元素

3.浮动元素上边是一个没有浮动的块元素 则浮动元素不会超过块元素

4.浮动元素不会发生越位上一个元素

七.

浮动：floa

1. 浮动元素不会盖住文字

2.块元素脱离文档流后 高度和宽度会被内容撑开

3.内联元素脱离文档流后会变成块元素

八.

高度塌陷问题：

为了子元素浮动会导致父元素高度塌陷：

1.将父元素高度定义值，但是父元素

解决高度塌陷问题：

2.页面元素隐含属性 BFC 该属性可以设置打开或者关闭  默认关闭，开启后元素会：

1.父元素的外边距不会和子元素外边距重叠

2.开启BFC的元素不会被浮动元素覆盖

3.父元素开启BFC 可以包含浮动的子元素

如何开启BFC：

1.设置元素浮动 会导致宽度丢失

2.设置元素绝对定位

3.设置元素inline-block

4.将元素的overflow设置非visible的值（outo）IE6及以下不支持  IE6有另一个隐藏属性叫hasLayout，开启方法：直接设置元素zoom为1

解决高度塌陷的最终方案：

1.clear：清除其他元素对当前元素的影响

属性值：left right both（两侧）

父子元素解决方案：

1.添加一个块元素设置clear

2..clearfix：after{content“”

display：block；

clear：both；}

九.

导航条：

1.text-decoration: none;取消链接下划线

2.list-style:none; 取消无序列表前面的序号

十

信息栏：

1.文字行高和父元素的高度一致 垂直居中

十.

相对定位：

position 可选值：

1.static 默认 不开启

2.relative 开启元素相对定位

3.absolute 开启绝对定位

4.fixed 开启元素固定定位

开启元素定位后：

1.相对于元素的原来位置进行定位

2.不会脱离文档流

3使元素提升一个层级

4.不会改变元素性质 块还是快 内联还是内联

绝对定位

position:absolute

开启后：

1.会使元素脱离文档流

2.绝对定位相对于离他最近的祖先元素定位

3.绝对定位会使元素提升一个层级

4.绝对定位会改变元素性质 内联元素会改变为块元素

固定定位：

position：fixed

1.和绝对定位一样

2.不同的是：固定定位是相对于浏览器位置定位

3.固定在浏览器窗口位置 不会随着滚动条移动

4.IE6不支持

十一.

层级显示：

1.同层级下 后面的元素会盖住前面的

2.通过z-index属性可以修改层级

3.z-index指定一个数值 该值越层级越高

4.对于没有开启定位的元素不能开启z-index

5.父元素层级不会盖住子元素

十二

opacity 透明元素

1.可以设置元素透明

2.0~1取值

3.在IE8以下的浏览器中不支持 需要使用filter：aloha（opacity=透明度 取值0-100）

十三

背景图片：

background-repeat：repea 左右平铺

backguround-repeat：no-repeat 不平铺

repeat-x 沿着x轴平铺

十四