導(dǎo)入css的文件的方式：
行內(nèi)樣式：只作用于標(biāo)簽內(nèi)
內(nèi)嵌樣式（常用）：只作用于本文件中
外部樣式表（常用）：可作用于所有文件,哪個(gè)文件需要用，就可以引用 ? 格式：
導(dǎo)入樣式表：用來管理@import url(另外一個(gè)css樣式)
注意：@import是css樣式標(biāo)簽，所以必須放到css文件中
選擇器的分類：
基本選擇器：
標(biāo)簽選擇器:選擇給哪個(gè)標(biāo)簽加樣式衔肢，自動(dòng)指向該標(biāo)簽
語法：標(biāo)簽選擇器名{屬性：屬性值}
body{} ??? p{} ??? div{} ??? table{} ??? td{} ??? ul{}
類選擇器:給一個(gè)類html標(biāo)簽加樣式
語法：類選擇器名{屬性：屬性值}赋荆，主要是給css使用
id選擇器：給特定的html標(biāo)簽加樣式
語法：id 選擇器{屬性：屬性值}
例如：#p{} ??? #body{} ??? #table{}
id只能被引用一次陡叠，主要是給javascript使用
通用選擇器:給所有的標(biāo)簽加樣式
語法：*{屬性：屬性值}?? 但I(xiàn)E6不支持
復(fù)合選擇器：
多元素選擇器：多個(gè)標(biāo)簽共有的屬性和屬性值，放到一起
語法：選擇器，選擇器绘沉，選擇器......{共有的屬性：屬性值}
后代元素選擇器：給html的后代標(biāo)簽加樣式（在一個(gè)選擇器里面的子選擇器加樣式）類里所有的標(biāo)簽
語法：選擇器1 ?? 選擇器2 ??? 選擇器3{屬性：屬性值}
子元素選擇器：給某個(gè)標(biāo)簽里面的第一層的標(biāo)簽加樣式
語法：選擇器1<選擇器2
偽類： -----錨(內(nèi)容必須做好鏈接)
a:link: 未訪問的鏈接樣式
a:visited: 訪問過的鏈接樣式
a:hover: 鼠標(biāo)移動(dòng)上的鏈接樣式
a:active:鼠標(biāo)點(diǎn)擊激活時(shí)的鏈接樣式
文本的屬性：
font-size:文本的大小 例如 font-size:12px
font-weight: 文本是否加粗 font-weight:bold
font-style:文本是否傾斜 font-style:italic煎楣；傾斜?? font-style:normal;正常
font-family:文字的字體 font-family:隸書；默認(rèn)是宋體
text-decoration: 文字是否加劃線 text-decoration:underline;下劃線 textdecoration:overline 上劃線 text-decoration: line-through;刪除線
text-indent:文本首行縮進(jìn) text-indent:2em
color 文本的顏色 color:red
letter-spacing: 字母和字母之間的間距 letter-spacing:2px;
word-spacing:單詞和單詞之間的間距 word-spacing:2px;
text-align:文本居中 text-aling:left 居左 text-align:right居右? text-align:center 居中
背景的屬性：
background-color:背景顏色
background-image:背景圖片
background-attachment：背景附件车伞，背景是否隨著上方的內(nèi)容一起滾動(dòng) 取值：fixed ：背景固定择懂，scroll滾動(dòng)；
background-repeat:背景圖片是否平鋪 取值：no-repeat不平鋪 repeat-x橫向平鋪 repeat-y縱向平鋪 repeat 橫向和縱向都平鋪（默認(rèn)）
background-position:背景圖片的展開方式 例如：background-position:水平 垂直另玖；
怎么表示：水平：left? center top??? 垂直：top center bottom 例如:background-position:10px 20px(代表靠左10px困曙，靠右20px展開)
可以簡寫：background:背景顏色 背景圖片 背景是否平鋪 （背景附件通常僅用在body標(biāo)簽用）水平 垂直;
background:url(images/bg.jpg) repeat-y fixed center 20px;
列表的樣式：
修改有序列表和無序列表前面的項(xiàng)目符號(hào)：
ol,ul {list-style:normal}??? 修改為無符號(hào)
ol,ul{list-style-image:url(images/protitle.jpg)}
表格的樣式：
合并表格和單元格的邊框線：
table{/*表格*/
width:800px;
border:1px solid blue;/*邊框線：1像素 實(shí)線 藍(lán)色*/
border-collapse:collapse；/*合并表格的邊框線*/
}
td{/*單元格*/
border:1px solid blue;
}
邊框（html標(biāo)簽就可以加邊框線）：
上下左右的邊框都一樣的話谦去，直接寫border就可以了
上邊框：
border-top-color：顏色值慷丽；上邊框的顏色
border-top-style：線型；線型有solid 實(shí)線鳄哭、dashed 虛線要糊、dotted 點(diǎn)狀線
border-top-width：粗細(xì)；像素值妆丘，2px...
簡寫：border:1px solid blue;
下邊框：
border-top-color：顏色值锄俄；上邊框的顏色
border-top-style：線型；線型有solid 實(shí)線勺拣、dashed 虛線奶赠、dotted 點(diǎn)狀線
border-top-width：粗細(xì)；像素值药有，2px...
簡寫：border:1px solid blue;
左右：border-left? border-right...
盒子模型：
內(nèi)容區(qū)：width和height
邊框：border
內(nèi)邊距：padding 內(nèi)容和邊框之間的距離
分為：上右下左 padding-top padding-right padding-bottom padding-left
外邊距：margin 邊框之外的距離
分為：上右下左 margin-top margin-right margin-bottom margin-left;
注意：如果是文檔流(縱向排列)毅戈，設(shè)置外邊距，取兩個(gè)盒子模型之間最大的間距
排列布局：
主流布局：left left right?????????? left left left
文檔流（縱向排序）:div默認(rèn)布局
橫向排序:float
常見情況：盒子里嵌套盒子
浮動(dòng)：
特點(diǎn)：
設(shè)置浮動(dòng)的元素愤惰，不占空間
設(shè)置浮動(dòng)的元素層級(jí)高于普通元素
設(shè)置浮動(dòng)之后竹祷，無論之前是否是塊元素，設(shè)置浮動(dòng)之后一定是塊元素
如果一行中的元素想橫向排列羊苟，都設(shè)置浮動(dòng)就可以
布局思想：
清除格式塑陵。 ? *{padding:0; margin:0}
設(shè)置頁面屬性。? 設(shè)置body{} ??? body{font-size:14px; font-family:宋體;color:#000000;background-cplpr:#e2e2e2; line-height:150%;}
把整個(gè)頁面劃分結(jié)構(gòu)蜡励。? 如頭部 內(nèi)容等等的結(jié)構(gòu)劃分令花，使用div來劃分
塊和行內(nèi)元素的轉(zhuǎn)換：
行內(nèi)元素：不是自己獨(dú)占一行，行內(nèi)元素的寬和高是由內(nèi)容來決定的（設(shè)置寬高無法使用）凉倚，默認(rèn)的css樣式是display:inline
span b i u strong a
塊元素： 自己獨(dú)占一行兼都，默認(rèn)寬高是0，根據(jù)寬高的內(nèi)容來決定稽寒，（寬高可以設(shè)置使用）扮碧，默認(rèn)的css樣式是:display:block
div p table ul li ol dl dt dd h1...
塊->行內(nèi)：
塊轉(zhuǎn)行內(nèi):display:inline
行內(nèi)->塊：
行內(nèi)轉(zhuǎn)塊:display:block
圖片溢出：當(dāng)圖片比塊元素大時(shí)，便會(huì)溢出
使用overflow：hidden
繼承：
子元素會(huì)繼承父元素的設(shè)置的屬性，但自己有的屬性慎王，不會(huì)向外繼承
優(yōu)先級(jí)：
單個(gè)選擇器的優(yōu)先級(jí)：
行內(nèi)樣式表(style) > id選擇器 > 類選擇器? > 標(biāo)簽選擇器
復(fù)合選擇器的優(yōu)先級(jí)：
寫的越精確蚓土，優(yōu)先級(jí)越高 > .class ul li{} > ul li{} > li{}
浮動(dòng)造成的影響和解辦法：
由于父控件不能給固定高，應(yīng)該根據(jù)內(nèi)容來自適應(yīng)高赖淤，所以在父控件里所有的div后面再加一個(gè)div蜀漆，并設(shè)置這個(gè)div的clear屬性為both;
clear:both;
清除浮動(dòng)：
clear:left;/*清除左浮動(dòng)*/
clear:right;/*清除右浮動(dòng)*/
clear:both;/*清除左右浮動(dòng)*/
盒子的深入計(jì)算：
計(jì)算公式：內(nèi)容的width + Margin + Padding
注意：正常的文檔流，margin計(jì)算時(shí)取最大值
定位(position)：
方式：
static咱旱，默認(rèn)設(shè)置
fixed确丢，固定位置。不占空間吐限。滾動(dòng)時(shí)鲜侥，也在原來的位置 設(shè)置偏移:left? right bottom top 如bottom:5px;
relative，相對定位诸典。占空間描函。需要結(jié)合定位坐標(biāo)。如果不結(jié)合定位坐標(biāo)搂赋，就是原來的位置赘阀；如果結(jié)合定位坐標(biāo)，相對于自身為參考點(diǎn)脑奠。（一般結(jié)合絕對定位來實(shí)現(xiàn)）
absolute基公，絕對定位。不占空間宋欺。不結(jié)合定位坐標(biāo)轰豆，就是原來的位置；如果結(jié)合定位坐標(biāo)齿诞，以設(shè)置定位坐標(biāo)的父控件為參考點(diǎn)酸休，如果父控件沒有設(shè)置position，會(huì)找父父控件的position祷杈，一直找到父級(jí)有設(shè)置position的控件為止斑司，來做參考點(diǎn)
