CSS選擇器是瀏覽器用來選擇頁面元素，執行效率比較高，每一種選擇都有比較詳細的解釋、內容較長，請耐心閱讀，有其他建議可在評論區討論
以下內容有：
根據id選擇
根據class選擇
根據tag標簽選擇
根據后代元素選擇
根據子元素選擇
根據組（group）選擇
根據兄弟節點選擇
根據屬性元素選擇
小技巧：如果選擇元素的時候，不確定選擇的內容是不是該元素的唯一屬性值，可以用ctrl + f 直接在頁面查找，比如找一個元素class 是 bg s_btn_wr的值,如果右下角那里顯示的是1，就說明是唯一值，如果顯示的是多個，就說明不是唯一值。
1、根據id選擇
查找到該元素的唯一id即可，比如根據這個百度輸入框的 id
driver.find_element_by_css_selector('#kw') #css根據id選擇元素，元素前面加一個#
1
2 、根據class 選擇
選擇該元素的唯一class屬性值，比如根據“百度一下”這個的元素來定位，該元素的class=‘bg s_btn_wr’
（注意：bg后面有一個空格，所以該元素實際上有兩個class）
#如果class只有一個的元素，比如代碼段是這樣的
<span class="soutu-btn"></span>
#用css選擇器就是
driver.find_element_by_css_selector（'.soutu-btn'） #元素前面加一個.
#如果class='bg s_btn_wr' (有兩個class),可以有以下三種寫法
第一種： driver.find_element_by_css_selector（'.bg'）
第二種： driver.find_element_by_css_selector('.s_btn_wr')
（第一種跟第二種查找的時候會有一個弊端，比如第一種，會查找到所有class='bg'的元素，第二種也是一樣）
第三種：是可以唯一對應到的
driver.find_element_by_css_selector（'.bg.s_btn_w'）
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
3、根據tag標簽選擇元素
比如根據標簽名span選擇
driver.find_element_by_css_selector('span')
1
4、后代元素選擇
選擇 “元素” 內部的 “元素”
語法 ： <s1> <s2> 選擇s1元素里面的所有s2元素 （可以是直接子節點，也可以不是）
比如
choose_car option 尋找id為choose_car的 option節點
driver.find_element_by_css_selector('#choose_car option')
footer p 的意思是找標簽名是footer里面的p
driver.find_element_by_css_selector('footer p')
1
2
3
4
5
6
7
8
9
還有一種寫法是很多級嵌套
查找ul里面的li ,li里面的div ，div里面的span
ul li div span
driver.find_element_by_css_selector('ul li div span')
1
2
5、子元素（child）選擇
選擇元素的子元素 （和后代選擇器有不同之處）
元素跟元素直接是直接隸屬的關系，可以用 >
#choose_car > option （option是choose_car的直接子節點）
choose_car是父級，option是子級 ， 是直接隸屬的關系
driver.find_element_by_css_selector('#choose_car > option')
footer > p也一樣，也是直接隸屬的關系
driver.find_element_by_css_selector('footer > p')
如果是很多級就是
driver.find_element_by_css_selector('ul > li > div > span')
1
2
3
4
5
6
7
8
9
10
6、組（group）選擇
組元素： 可以同時選擇多個元素，用逗號隔開
語法： <s1>,<s2>
比如 p ,button 意思是選擇所有p節點跟button節點
#food,.cheese
選擇所有id為food節點跟所有class為cheese的節點
#food > span , p
意思是選擇所有id為food的所有span子元素跟所有p元素
（注意P不屬於food）
#food > span , #food > p
選擇id為food的所有span子元素和所有的p元素，這里的p是屬於food的
#food > *
選擇id為food的所有子元素
選擇所有子元素就用 *
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
7、兄弟節點元素選擇
兄弟節點選擇：選擇緊接在另一個元素后的元素，二者有相同的父元素
比如：
#food + div
是指選擇id為food元素緊跟着的div （這兩個是平級的）
#food ~ div
是指選擇id為food元素后面所有的div （這兩個元素之間也是平級的）
#food > div > p.special + a
div是food的子元素，p.special是div的子元素
選擇id為food下面的元素里面的div,再選擇div里面的p節點，class屬性為special的元素 ，a元素是緊跟p.special的 （二者是平級的）
1
2
3
4
5
6
7
8
9
10
11
12
13
14
8、屬性元素選擇器
*[style] 意思是選擇所有具有style屬性的元素
P[spec=len2] 選擇所有p節點，有spec屬性，並且spec的屬性值等於len2的 （選中的就是上圖test4這個元素）
P[spec='len2 len3'] 選擇所有p節點，有spec屬性，並且spen屬性等於len2 len3 （選中的就是test5）
P[spec*='len2'] 選中所有P節點，只要spec屬性有len2就能被選中
（選中的是test4跟test5）
P[spec^='len2'] 選擇所有P節點，有spec屬性，並且是以len2開頭的
P[spec$='len2'] 選擇所有P節點，有spec屬性，並且以len2結尾的
P[class=special] [name=p1] 選擇p節點中屬性class=special，並且name=p1的元素
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
#food >p:nth_child(3)
選擇父元素id為food的第三個子元素，選中的就是黃瓜PP
#food >p:nth_child(4)
選擇父元素id為food的第四個子元素，選中的就是青菜
1
2
3
4
5
6
#food >p:nth_last_child(3)
選擇id為food的倒數第三個元素
（選中的是空的，就是沒有這個元素 p類型只有兩個，倒數第三個是span）
1
2
3
#food >p:nth_of_type(2)
選擇id為food的p類型的第二個節點，選中的就是青菜
1
2
#food >p:nth_last_of_type(2)
選擇if為food的p類型的，倒數第二個節點，也就是黃瓜