只插入部分元素：
在:after，:before前使用更嚴格的CSS選擇器
配合quotes屬性執行插入
首先定義quotes,然后再指定content使用open-quote或者close-quote
配合counter-increment屬性添加編號
該屬性指定的字符就是計算器名稱，然后通過counter屬性引用計數器即可
使用自定義編號：通過counter(name,list-style-type)實現
其中，list-style-type:
decimal:阿拉伯數字，默認值。
disc:實心圓
circle:空心圓
lower-roman:小寫羅馬數字
upper-roman:大寫羅馬數字
lower-alpha:小寫英文字母
upper-alpha:大寫英文字母
none:不使用項目符號
cjk-ideographic:淺白的表意數字,漢字一二三
georgian:傳統的喬治數字
lower-greek:基本的希臘小寫字母
hebrew:傳統的希伯來數字
hiragana:日文平假名字符
hiragana-iroha:日文平假名序號
katagana:日文片假名字符
katagana-iroha:日文片假名序號
lower-latin:小寫拉丁字母
upper-latin:大寫拉丁字母
添加多級編號：
定義多個編號計數器，然后為不同的選擇器插入不同的計數器即可
在設置二級編號時，使用counter-reset來自動重置指定的計數器
結構性偽類選擇器
Selector:root：匹配文檔的根元素，在html文檔中，跟元素永遠是<html>元素
Selector:first-child：父元素的第一個Selector子元素
Selector:last-child：父元素中最后一個Selector子元素
Selector:nth-child(n)：父元素中第n個Selector子元素，當n為odd/event時，表示第奇數/偶數個
Selector:nth-last-child(n)：父元素中倒數第n個Selector子元素，當n為odd/event時，表示第奇數/偶數個，n也可以為“3n+1”表示倒數第3n+1個子節點(1,4,7...)
Selector:only-child：是其父元素的唯一子元素的Selector
Selector:first-of-type：其父元素中匹配Selector的第一個元素
Selector:last-of-type：其父元素中匹配Selector的最后一個元素
Selector:nth-of-type(n)：其父元素中匹配Selector的第n個元素
Selector:nth-last-of-type(n)：其父元素中匹配Selector的倒數第n個元素
Selector:only-of-type：其父元素中唯一一個元素
Selector:empty：內部沒有任何子元素的Selector，Selector省略時表示對所有的空元素
UI元素狀態偽類選擇器
Selector:link：未被訪問的Selector元素，通常Selector只能是超鏈接元素
Selector:visited：已經被訪問過的Selector元素，通常Selector只能是超鏈接元素
Selector:active：鼠標在點擊與釋放之間的Selector元素
Selector:hover：鼠標處於懸停狀態的Selector元素
Selector:focus：得到焦點的Selector元素
Selector:enable：處於可用狀態的Selector元素
Selector:disable：處於不可用狀態的Selector元素
Selector:checked：處於選中狀態的Selector元素
Selector:default：頁面打開時處於選中狀態的Selector元素
Selector:read-only：處於制度狀態的Selector元素
Selector:read-write:處於讀寫狀態的Selector元素
Selector::selection：Selector元素中當前被選中的內容
其中:default指的是哪個狀態沒搞明白
瀏覽器專屬屬性，加前綴
-ms-：對應Internet Explore瀏覽器
-moz-：對應Gecko引擎的瀏覽器，如Firefox瀏覽器
-o-：對應Opera瀏覽器
-webkit-：對應基於Webkit引擎的瀏覽器，如Chrome,Safari瀏覽器
特殊偽類選擇器
Selector:target：匹配符合Selector選擇器且必須是命名錨點目標的元素
Selector1:not(Selector2)：符合Selector1但不符合Selector2的元素
在腳本中修改顯示樣式，步驟：
1、獲取到需要設置CSS樣式的目標元素，例如可以使用getElementById(‘')
2、修改目標元素的CSS樣式，常用方法有兩種：
①修改內聯CSS屬性值，例如：obj.style.屬性名 = 屬性值
②修改HTML元素的class屬性值，例如：obj.className = class 選擇器
動態增加立體效果：
左、上邊框的顏色稍淺，右、下邊框顏色稍深，即為立體效果（使用Javascrpt對class進行更改）