css3選擇器相關

input[type="text"]匹配text類型 

input[value="abc"]匹配val=abc

input[value^="abc"]匹配val起始位置=abc

input[value$="abc"]匹配val結束位置=abc

input[value*="abc"]匹配val任意位置=abc

li:nth-child(2){background-color: red;} li父容器的第二個元素

li:nth-of-child(2){background-color: red;} 跟上面比of會無視其餘元素，僅計算li元素

only-of-type同上
li:nth-child(3n+1){background-color: red;}第一個起每三行
li:nth-child(4n+2){background-color: yellow;}第二個起每四行
li:hover{background-color: blue;}鼠標選擇
li:first-child{background-color: red;}第一個
li:last-child{background-color: red;}最後一個
li:only-child{background-color: red;}惟一元素

li:not(.box){background-color: red;}取反

li:empty{background-color: red;} 選空元素

:target {color: red;} 錨點跳轉後目標樣式

input:focus{border: 1px solid red;outline: none;}  選中樣式
input[type="checkbox"]:checked + span{background-color: red;} 選中樣式

::selection{background-color: #333;} 選中樣式

::-moz-selection{background-color: #333;}支持火狐

#asd:first-letter{font-size: 50px;} 首字節樣式
#asd:first-line{background-color: #333;}首行樣式

-moz-表明firefox瀏覽器私有屬性
-ms-表明IE瀏覽器私有屬性
-webkit-表明chrome、safari私有屬性

<input type="" name="" disabled value="123">禁用 <input type="" name="" readonly value="321">只讀