九阴真经 第二层 第1天

position:absolute 比 浮动的元素 还要高 一层
选择文字，ctrl+alt+t 环绕标签
可以父absolute ,子也absolute ，子依然参照父亲 。但假如父亲的父亲没有relative的话，那么父亲就是参照浏览器
父relative ,子absolute 的好处是，子依然参照父亲。但relative可以让父亲 占有位置，因为如果子绝父绝，那么它们都会飘上去，下面的盒子会顶上来。所以relative的最大用处是占住位置

===================================================================

CSS 初始化

/*css 初始化 */
html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; } 
fieldset, img,input,button { border:none; padding:0;margin:0;outline-style:none; }
ul, ol { list-style:none; }
input { padding-top:0; padding-bottom:0; font-family: "SimSun","宋体";}
select, input { vertical-align:middle; }
select, input, textarea { font-size:12px; margin:0; }
textarea { resize:none; }
img {border:0;	vertical-align:middle;}
table { border-collapse:collapse; }
body {
    font:12px/150% Arial,Verdana,"5b8b4f53";
    color:#666;
    background:#fff
}
.clearfix:before,.clearfix:after{ 
    content:""; 
    display:table; 
} 
.clearfix:after{clear:both;} 
.clearfix{ 
    *zoom:1;/*IE/7/6*/ 
} 
a{color:#666; text-decoration:none; }
a:hover{color:#C81623;}
h1,h2,h3,h4,h5,h6{text-decoration:none;font-weight:normal;}
s,i,em{font-style:normal;text-decoration:none;}
.col-red{color: #C81623!important;}

/*公共类*/
.w{
     1210px;margin:0 auto;
}
.fl {
	float:left
}
.fr {
	float:right
}
.al {
	text-align:left
}
.ac {
	text-align:center
}
.ar {
	text-align:right
}
.hide {
	display:none
}

Favicon 图标

Css基本
Font 字体综合写
Font: 字体加粗 字号/行高 字体;
必须有字号和字体。
Font-weight:bold; 700

S del 删除线
I em 倾斜
U ins 下划线
字体加粗 font-weight: 700;
让字体不加粗: font-weight:normal;
字体倾斜: font-style:italic; 不用
字体不倾斜： font-style:normal;
不下划线 不删除线: text-decoration: none;

  定位：  position：static;  静态定位   约等于标准流
  浮动的不浮动: float:none;      none  left  right
  定位的不定位:  position: static;    absolute  relative  fixed 

  标签  1     类  10   id  100  行内  1000     
  网页稳定：
    Width 和height  最稳定
    其次 padding     
    最后才考虑margin

浮动(float)
正常流 normal flow
浮动 定位 脱标 out of flow
浮动目的：
可以让多个块级 元素 放到一行上。
Float: left right none;

清除浮动
清除浮动： 根据情况需要来清楚浮动 。
清除浮动的目的： 就是为了解决 父 盒子高度为0 的问题。
清除浮动：

1. 额外标签法
2. Overflow: hidden 触发 bfc 模式 就不用清楚浮动
3. 伪元素
   .clearfix:after {
   content:””;
   Visibility:hidden;
   Display:block;
   Height:0;
   Clear:both;
   }
   .clearfix{
   Zoom:1;
   }
   清除浮动： 真正的叫法 闭合浮动
4. 双伪元素

.clearfix:before,.clearfix:after{
    display: table;
    content: "";
}
.clearfix:after {
    clear: both;
}
.clearfix {
    zoom: 1;
}