CSS定義：
CSS 指層疊樣式表 (Cascading Style Sheets)
CSS通常稱為CSS樣式表或?qū)盈B樣式表（級聯(lián)樣式表），主要用于設(shè)置HTML頁面中的文本內(nèi)容（字體、大小、對齊方式等）、圖片的外形（寬高、邊框樣式、邊距等）以及版面的布局等外觀顯示樣式。
CSS以HTML為基礎(chǔ)，提供了豐富的功能，如字體、顏色、背景的控制及整體排版等，而且還可以針對不同的瀏覽器設(shè)置不同的樣式。
CSS就是控制頁面布局和樣式。
CSS的版本：到了3.0版本。（目前還是用2.1版本）
HTML和CSS的關(guān)系：
HTML結(jié)構(gòu)層負責從語義的角度搭建頁面結(jié)構(gòu)。（HTML：頁面結(jié)構(gòu)）
CSS樣式層負責從審美的角度美化頁面。（CSS：頁面樣式表現(xiàn)）
JavaScript行為層負責從交互的角度提升用戶體驗。（JavaScript：交互行為）
引入CSS的方式：
所有的標簽都有一個默認樣式，我們稱為瀏覽器樣式，或者默認樣式。
缺省樣式（瀏覽器樣式）：
可以通過設(shè)置修改瀏覽器的樣式 ；?所有的標簽都有默認的樣式：h1,h2,p,div,span,ul等。
缺省樣式（瀏覽器樣式）的優(yōu)先級是最低的。
補充快捷鍵：看上圖。
行內(nèi)樣式：
行內(nèi)樣式，是通過在標簽中設(shè)置style屬性來達到實現(xiàn)控制標簽的樣式的效果。（下圖）{red后面少了個；}
Style屬性中，可以設(shè)置多條的CSS樣式。（下圖）
嵌入樣式：
嵌入樣式又叫：內(nèi)嵌樣式、內(nèi)部樣式。
在head標簽中，嵌套一個style標簽，在style標簽中可以書寫CSS的樣式內(nèi)容。
Style標簽有一個屬性type屬性，默認值就是text/css,可以省略。
外部樣式（外聯(lián)樣式）：
通過link標簽引入css樣式文件。
type屬性：只有一個選項，“text/css"，指定當前為css文本文件。（）
rel：指定當前HTML文件與CSS文件的關(guān)系是樣式表。href：指定外聯(lián)樣式表的路徑。
導(dǎo)入樣式：@import，導(dǎo)入樣式會導(dǎo)致，css文件不能并行下載。不推薦使用。
導(dǎo)入樣式的書寫必須在所有的css規(guī)則書寫之前。
導(dǎo)入樣式：
@import，導(dǎo)入樣式會導(dǎo)致，css文件不能并行下載。不推薦使用。
導(dǎo)入樣式的書寫必須在所有的css規(guī)則書寫之前。
CSS語法：
選擇符、屬性聲明、括號。
換行不敏感、空格不敏感
CSS簡單屬性：
width：設(shè)置寬度，單位px像素。
height：高度。
color：前景色，也就是文字的顏色。
background-color：背景色。
font-size:字體的大小。
CSS案例：
CSS注釋：
CSS的注釋語法： ? /*注釋的內(nèi)容*/
注釋不能嵌套，比如：? /*注釋的*/內(nèi)容*/? （中間多了*/，是錯誤的）
多行注釋：
/*
放多行的注釋內(nèi)容1
放多行的注釋內(nèi)容2
*/
一般用于模塊的 注釋：
文件頭的注釋：
例如：
CSS選擇器：
標簽選擇器：
標簽選擇器就是選擇當前頁面中相同名字的標簽
通配符選擇器
通配符選擇器用“*”號表示，他是所有選擇器中作用范圍最廣的，能匹配頁面中所有的元素。
基本語法格式： ?*{屬性1:屬性值1;屬性2:屬性值2; 屬性3:屬性值3;}
使用通配符選擇器定義CSS樣式，清除所有HTML標記的默認邊距。
通配符的穿透力很強，優(yōu)先級高于繼承的樣式，會覆蓋繼承的樣式。一般不用。
ID選擇器
HTML標簽中ID的屬性值在一個頁面中必須是唯一的。
id一般用于css的選擇器和js的鉤子。
ID選擇器是可以幫助我們選擇當前頁面中唯一id值的標簽，也就是根據(jù)標簽的id屬性值進行選取設(shè)置樣式。
id選擇器使用“#”進行標識，后面緊跟id名。
語法： ?#id名{屬性1:屬性值1; 屬性2:屬性值2; 屬性3:屬性值3; }
類選擇器：
類選擇器就是選取頁面中所有標簽的class屬性值相同的一類標簽。
類選擇器的符號是： ?.? (點)
標簽可以包含多個類選擇器，在class標簽中用空格隔開。
ID選擇器和class選擇器的區(qū)別
相同的Class屬性值，可以在HTML中出現(xiàn)多次。ID屬性值在頁面中只能出現(xiàn)一次。
一個class的屬性可以有多個值，也就是說一個標簽可以有多個類。
盡量使用類選擇器。使用ID時候情況：當確實能唯一確定當前頁面中標簽只會出現(xiàn)一次，這時候可以使用ID選擇器。
如果不能保證相同的作用的標簽在頁面中只出現(xiàn)一次，那么這時候就選擇使用類選擇器。
選擇器綜合案例
CSS復(fù)合選擇器
復(fù)合選擇器是由兩個或多個基礎(chǔ)選擇器，通過不同的方式組合而成的。
標簽指定式選擇器（即....又....）
標簽指定式選擇器又稱交集選擇器，由兩個選擇器構(gòu)成，其中第一個為標記選擇器，第二個為class選擇器或id選擇器，兩個選擇器之間不能有空格，如h3.special或p#one。
比如：h3.demo {} ,需要同時滿足既是標簽h3又擁有demo類才能被選擇到。
注意：使用非常少，一般不用。要么直接用id選擇器，要么直接用類選擇器。
后代選擇器：
后代選擇器用來選擇元素或元素組的后代，其寫法就是把外層標記寫在前面，內(nèi)層標記寫在后面，中間用空格分隔。當標記發(fā)生嵌套時，內(nèi)層標記就成為外層標記的后代。
并集選擇器：
并集選擇器是各個選擇器通過逗號連接而成的，任何形式的選擇器（包括標記選擇器、class類選擇器id選擇器等），都可以作為并集選擇器的一部分。如果某些選擇器定義的樣式完全相同，或部分相同，就可以利用并集選擇器為它們定義相同的CSS樣式。
子元素選擇器：
子代選擇器，是讓CSS選擇器智能選擇兒子輩的元素。
尖括號和選擇器之間可以有空格也可以沒有，沒有限制。
建議:選擇器和尖括號間有空格。
屬性選擇器：
屬性選擇器就是根據(jù)html標簽的屬性進行過濾選擇。
CSS偽類 偽元素：
狀態(tài)是動態(tài)變化的，當一個元素達到一個特定狀態(tài)時，它可能得到一個樣式，當狀態(tài)改變時，又失去這個樣式。
它的功能和class有些類似，但它是基于文檔之外的抽象，所以叫偽類。
CSS偽類：
:link ? ? ? ?偽類將應(yīng)用于未被訪問過的鏈接。IE6不兼容，解決此問題，直接使用a標簽。
:hover ? ? ? ?偽類將應(yīng)用于有鼠標指針懸停于其上的元素。在IE6只能應(yīng)用于a連接，IE7+所有元素都兼容。
:active ? ? ? ?偽類將應(yīng)用于被激活的元素，如被點擊的鏈接、被按下的按鈕等。
:visited ? ? ? ?偽類將應(yīng)用于已經(jīng)被訪問過的鏈接
:focus ? ? ? ?偽類將應(yīng)用于擁有鍵盤輸入焦點的元素。
順序問題：LoVeHAte原則?？聪聢D（順序不要亂了）
偽元素選擇器
偽元素?是控制內(nèi)容。
:first-line偽元素。
:first-letter偽元素。
注釋：以上兩個偽元素只能用于塊級元素。
:first-child偽元素，選擇屬于第一個子元素的元素。
例如：span:first-child{ } ?（選擇屬于第一個子元素的所有span標簽。）
:before與:after偽元素，可以設(shè)置元素之前后之后的內(nèi)容，并且配合content設(shè)置相關(guān)內(nèi)容。比如：#demo:after,#demo:before{content:"--";display:block;}
重點，圈起來，會考
下面兩圖有不同效果：
CSS的層疊性:
CSS的層疊性，也就是說后來設(shè)置的樣式會層疊（覆蓋）之前的樣式，層疊性的前提是CSS的選擇器的優(yōu)先級相同。
例如，當使用內(nèi)嵌式CSS樣式表定義標記字號大小為12像素，鏈入式定義標記顏色為紅色，那么段落文本將顯示為12像素紅色，即這兩種樣式產(chǎn)生了疊加。
?CSS繼承性：
所謂繼承性是指書寫CSS樣式表時，子標記會繼承父標記的某些樣式（子容器的樣式會繼承父容器的樣式），如文本顏色和字號。想要設(shè)置一個可繼承的屬性，只需將它應(yīng)用于父元素即可。
恰當?shù)厥褂美^承可以簡化代碼，降低CSS樣式的復(fù)雜性。但是，如果在網(wǎng)頁中所有的元素都大量繼承樣式，那么判斷樣式的來源就會很困難，所以對于字體、文本屬性等網(wǎng)頁中通用的樣式可以使用繼承。例如，字體、字號、顏色、行距等可以在body元素中統(tǒng)一設(shè)置，然后通過繼承影響文檔中所有文本。
所有字相關(guān)的都可以繼承，比如：color、text-系列、font-系列、line-系列、cursor
并不是所有的CSS屬性都可以繼承，例如，下面的屬性就不具有繼承性：邊框、外邊距、內(nèi)邊距、背景、定位、元素寬高屬性。
所有盒子相關(guān)的屬性都不能繼承。
CSS的特殊性（優(yōu)先級）：
CSS的特殊性，定義CSS樣式時，經(jīng)常出現(xiàn)兩個或更多規(guī)則應(yīng)用在同一元素上，那么誰的優(yōu)先級更高呢，這就是CSS的特殊性。
內(nèi)聯(lián)樣式最大，內(nèi)聯(lián)樣式的優(yōu)先級最高。> ? ? ID選擇器的優(yōu)先級，僅次于內(nèi)聯(lián)樣式。> ? ?類選擇器優(yōu)先級低于ID選擇器。> ? ?標簽選擇器低于類選擇器。
256個標簽選擇器相加大于 一個類選擇器 ， ?256個類選擇器相加大于 一個ID選擇器。
在考慮權(quán)重時，還需要注意一些特殊的情況，具體如下：
繼承樣式的權(quán)重為0。即在嵌套結(jié)構(gòu)中，不管父元素樣式的權(quán)重多大，被子元素繼承時，他的權(quán)重都為0，也就是說子元素定義的樣式會覆蓋繼承來的樣式。
行內(nèi)樣式優(yōu)先。應(yīng)用style屬性的元素，其行內(nèi)樣式的權(quán)重非常高，可以理解為遠大于100?？傊麚碛斜壬厦嫣岣叩倪x擇器都大的優(yōu)先級。
權(quán)重相同時，CSS遵循就近原則。也就是說靠近元素的樣式具有最大的優(yōu)先級，或者說排在最后的樣式優(yōu)先級最大。
所有都相同時，聲明靠后的優(yōu)先級大。
CSS定義了一個!important命令，該命令被賦予最大的優(yōu)先級。也就是說不管權(quán)重如何以及樣式位置的遠近，!important都具有最大優(yōu)先級。
綜述：行內(nèi)樣式 > 頁內(nèi)樣式 > 外部引用樣式 >瀏覽器默認樣式。
?important > 內(nèi)聯(lián) >ID > 偽類|類 | 屬性選擇> 標簽> 偽對象 >通配符 > 繼承。
復(fù)合選擇器的樣式優(yōu)先級核算：
