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类型的，倒数第二个节点，也就是黄瓜