1.1選擇器
1.1.1通用選擇器：選中頁面中所有的標簽。
*{
屬性名:屬性值;
color:red;
}
1.1.2標簽選擇器：選中html中的標簽。
li{
}
1.1.3類選擇器（class選擇器）：在html標簽中，使用class="class名"調用選擇器。
.class名{
}
1.1.4ID選擇器：在html標簽中，使用id="id名"調用選擇器。
#id名{
}
1.1.5交集選擇器：選擇器1選擇器2選擇器3......{}，沒有間隔。
#first.li1{
}
必須滿足交集選擇器中出現的所有選擇器。
1.1.6並集選擇器：選擇器1,選擇器2,選擇器3,......{}，逗號分隔。
#first,.li1{
}
只要滿足其中任意一個，即可全部生效。
1.1.7后代選擇器：選擇器1 選擇器2 選擇器3 ......{}，空格分隔。
div .li1{
}
必須滿足后一個選擇器是前一個選擇器的后代（子代、孫代、重孫代......）
1.1.8子代選擇器：選擇器1>選擇器2>選擇器3>......{}，用>分隔。
div>ul>.li1{
}
div{
}
后一個選擇器是前一個選擇器的直接子代才會生效，隔代（中間包含其它標簽）則不會生效。
1.2小結
1.2.1選擇器的命名規則
只能由字母、數字、下划線、減號構成，且開頭不能是數字。
1.2.2選擇器的優先級
①首先遵循近者優先原則，作用於最里層標簽的選擇器優先生效。
②作用於同一層標簽時，優先級如下：行級樣式表>ID選擇器>class選擇器>標簽選擇器>通用選擇器。
③行級樣式表>頁內樣式表。
1.2.3ID選擇器與class選擇器的區別
①寫法不同。
②優先級不同。
③在同一個HTML文件中，id是唯一的，id選擇器只能作用於一個標簽上，class選擇器可以作用於多個標簽。
1.2.4選擇器按權重計算優先級
①只有交集、后代、子代選擇器才有優先級的累加，並集選擇器相當於寫了多個選擇器，沒有總優先級。
②近者優先。
③當作用於同一層時，標簽選擇器，占權重1；
class選擇器，占權重10；
id選擇器，占權重100；
行級樣式表 style=""，占權重1000。
④如果計算出的優先級相同，則后寫的選擇器生效。
#div.div{}
.div#div{}
2.1文本屬性
2.1.1顏色單位表示
①使用顏色名稱表示：red/blue/green
②十六進制數：#ffffff #000
③rgb(255,255,0)
④rgba(255,255,0,0.2)：第四位表示透明度，0表示全透明，1表示不透明
2.1.2常用文本屬性
①font-style：設置斜體：italic/normal。
②font-weijht：字體粗細：bold/normal/lighter或用100~900數值，400=normal、700=bold。
③font-size：字體大小：px/%（瀏覽器默認大小的百分比，默認16px）
④line-height：行高
⑤font-family：字體，多個字體之間用逗號分隔，若電腦不支持第一個則依次順延。
例：font-family:"隸書","宋體",sans-serif;
最后一個是字體族，sans-serif/serif，當前面的字體都不被支持時，推薦瀏覽器從規定的字體族中選擇一個。
⑥縮寫形式：font-style font-weight font-size/line-height font-family
例：font:italic bold 18px/1.8 "黑體","微軟雅黑",sans-serif;
⑦color：字體顏色
⑧text-align：對齊，center水平居中。
⑨letter-spacing：字符間距
⑩text-decoration:underline下划線、overline上划線、line-through刪除線
①①overflow：超出范圍的文字處理，hidden隱藏、scroll滾動條、auto自動。
①②white-space:nowrap;設置文字在一行顯示，不斷行。
2.1.3常見背景屬性
①background-color：背景色
② background-image：背景圖
③background-repeat：no-repeat不重復、repeat重復、repeat-x(y)橫(縱)向重復。
④background-position:
>>>兩個屬性，一個寫“上中下” 一個寫“左中右”，空格分割；例如 :left top;
>>>百分數，第一個寫x軸位置，第二個寫y軸位置。例如：0% 100%位於左下角；
如果只寫一個，默認第二個為50%；
>>>坐標點，第一個寫x軸位置，第二個寫y軸位置。例如：0px 0px位於左上角；
如果只寫一個，默認第二個為50%；
總結：圖片相對於父容器移動，左負右正，上負下正。
⑤background-origin：表示圖片相對於哪個位置定位（圖片的左上角與誰的左上角對齊）border-box：外邊框、padding-box：內邊框、content-box內容框。
⑥background-size:圖片的大小，有三種常見寫法：
>>>直接寫像素大小，例如background-size:500px 100px; 寬為500，高為100；
>>>contain，把圖片放到最大尺寸。由父容器的寬或高中較短的一邊決定；
>>>cover，圖片覆蓋父容器全部區域。
2.1.4常見的列表屬性：list-style
也可以通過url導入圖片，設置為小圖標；
2.1.5超鏈接的常見屬性：
去掉超鏈接下划線：text-decoration:none;
2.1.6常見的偽類：
：focus 元素獲得焦點：即鼠標點擊上以后，鼠標再點擊其余地方就會失去焦點。