来一波技术贴，整理下自己的东西position：
static                                        静态定位     无定位的意思相当于border的none。静态定位无法使用边偏移。
relative                                     相对定位  自恋型，相对自身原来位置改变，相对于自己原来的标准流区域继续占有。后面的盒子还是按照标准流。
absolute                                   绝对定位以父亲元素进行定位，父亲需要定位。如果没有定位，则参考浏览器文档为准。，不保留位置，脱离标准流，不占用位置。
                                                 子绝父相。父亲因为要占有位置，所以必须用相对定位。这样相邻的就不上去了。
绝对定位无法用margin水平居中。
fixed                                         固定定位：不占位置，只认浏览器可视窗口为主。和父级没有任何关系，不随滚动条滚动。


定位=定位模式+边偏移
页面在实际显示盒子的位置的时候包含margin值。
标准流和浮动压不住图片

定位居中
先移动盒子的一般top50%，接着往回走自己margin一半。margin-top：-多少px；



清除浮动:

为神马要清除浮动？

1. 当父元素没有高度的时候，浮动的子元素 无法撑开父元素 ，导致父元素高度为0，父元素后面标准流中的兄弟元素就会占据父元素的位置

清除浮动的属性:  clear:both

清除浮动的方法:

1. 额外标签法 增加一个带有清除浮动属性的 空标签
   用法: 谁浮动就给最后浮动的元素后面增加一个 带有清除浮动属性的空标签
   缺点:会给页面增加许多没有用的空标签 导致页面结构混乱

2. 给父元素设置overflow :hidden

3.3.使用after伪元素清除浮动。（假的标签，使用css创造）
.clearfix:after{
   content:"";        content属性一定要写,老版本的火狐“”里加一个点.
   display：block；
    height:0;
     visibility：hidden；
    clear：both;
}
  .clearfix{
         *zoom:1；              兼容IE6 7
}

4使用双伪元素清除浮动

z-index
只能给相对定位，绝对定位，固定定位设置层级
定位层级高于标准流，浮动元素
默认值为0 ，后来者居上，谁靠后，谁层级高。
只能设置0，负整数，正整数。


忍得住寂寞，方能守住繁华。
.块级元素的特点：独占一行 ；可以控制大小、内外边距 ；宽度默认为100% ；容器可以嵌套其它元素
  注：文本类块级元素h，p，dt不能嵌套div 包括自己

2 行内元素的特点：一行内显示多个 ；只能容纳文本或其他行内元素；宽高无效（包括垂直方向的内外边距！） ；默认宽度是本身 a不能包a但是可以嵌套块级！
3.行内块元素特点：行内块：（img input textarea... ）可以设置大小；同一行显示（白色空隙是换行引起）；大小由内容决定
4.margin塌陷解决：1给父元素设置边框   2给父元素设置一个像素上内边距  3给父元素设置overflow：hidden属性（常用）  4父元素/子元素加float属性  5父元素/子元素加position：fixed/absolute属性
5.浮动元素特点：1脱离标准流 不占位置   2显示模式改变 类似行内块元素  3只会影响当前和后面的标准流元素   4不会超过/覆盖父元素的边框和内边距
6.font:font-style font-weight (font-size/line-height)! font-family 注：使用综合写法不带行高有默认字体大小行高
7.span,a,em,strong,del,ins...这类元素不能设置text-align：center/right/left属性
8.thead 和tbody （tfoot）之间不能跨列合并
9.浮动盒子边变行内块 可以设宽高
10.计算器快捷运行：运行calc
11.关于li在版心里装不下的时候处理办法：
可以设置子盒子宽度（加上外边距）大于父盒子，子盒子可以比父盒子大
12.div嵌套img时多出的空白怎么解决？给img设置vertical-align为baseline以外的值或者改变img的显示模式

来一波技术贴，整理下自己的东西position：
static                                        静态定位     无定位的意思相当于border的none。静态定位无法使用边偏移。
relative                                     相对定位  自恋型，相对自身原来位置改变，相对于自己原来的标准流区域继续占有。后面的盒子还是按照标准流。
absolute                                   绝对定位以父亲元素进行定位，父亲需要定位。如果没有定位，则参考浏览器文档为准。，不保留位置，脱离标准流，不占用位置。
                                                 子绝父相。父亲因为要占有位置，所以必须用相对定位。这样相邻的就不上去了。
绝对定位无法用margin水平居中。
fixed                                         固定定位：不占位置，只认浏览器可视窗口为主。和父级没有任何关系，不随滚动条滚动。


定位=定位模式+边偏移
页面在实际显示盒子的位置的时候包含margin值。
标准流和浮动压不住图片

定位居中
先移动盒子的一般top50%，接着往回走自己margin一半。margin-top：-多少px；



清除浮动:

为神马要清除浮动？

1. 当父元素没有高度的时候，浮动的子元素 无法撑开父元素 ，导致父元素高度为0，父元素后面标准流中的兄弟元素就会占据父元素的位置

清除浮动的属性:  clear:both

清除浮动的方法:

1. 额外标签法 增加一个带有清除浮动属性的 空标签
   用法: 谁浮动就给最后浮动的元素后面增加一个 带有清除浮动属性的空标签
   缺点:会给页面增加许多没有用的空标签 导致页面结构混乱

2. 给父元素设置overflow :hidden

3.3.使用after伪元素清除浮动。（假的标签，使用css创造）
.clearfix:after{
   content:"";        content属性一定要写,老版本的火狐“”里加一个点.
   display：block；
    height:0;
     visibility：hidden；
    clear：both;
}
  .clearfix{
         *zoom:1；              兼容IE6 7
}

4使用双伪元素清除浮动

z-index
只能给相对定位，绝对定位，固定定位设置层级
定位层级高于标准流，浮动元素
默认值为0 ，后来者居上，谁靠后，谁层级高。
只能设置0，负整数，正整数。


忍得住寂寞，方能守住繁华。
.块级元素的特点：独占一行 ；可以控制大小、内外边距 ；宽度默认为100% ；容器可以嵌套其它元素
  注：文本类块级元素h，p，dt不能嵌套div 包括自己

2 行内元素的特点：一行内显示多个 ；只能容纳文本或其他行内元素；宽高无效（包括垂直方向的内外边距！） ；默认宽度是本身 a不能包a但是可以嵌套块级！
3.行内块元素特点：行内块：（img input textarea... ）可以设置大小；同一行显示（白色空隙是换行引起）；大小由内容决定
4.margin塌陷解决：1给父元素设置边框   2给父元素设置一个像素上内边距  3给父元素设置overflow：hidden属性（常用）  4父元素/子元素加float属性  5父元素/子元素加position：fixed/absolute属性
5.浮动元素特点：1脱离标准流 不占位置   2显示模式改变 类似行内块元素  3只会影响当前和后面的标准流元素   4不会超过/覆盖父元素的边框和内边距
6.font:font-style font-weight (font-size/line-height)! font-family 注：使用综合写法不带行高有默认字体大小行高
7.span,a,em,strong,del,ins...这类元素不能设置text-align：center/right/left属性
8.thead 和tbody （tfoot）之间不能跨列合并
9.浮动盒子边变行内块 可以设宽高
10.计算器快捷运行：运行calc
11.关于li在版心里装不下的时候处理办法：
可以设置子盒子宽度（加上外边距）大于父盒子，子盒子可以比父盒子大
12.div嵌套img时多出的空白怎么解决？给img设置vertical-align为baseline以外的值或者改变img的显示模式