首先何為css, css指層疊樣式表（cascading style sheets）用來告訴瀏覽器如何顯示html元素，它的基礎語法為： selector ，selector即選擇器用來定位元素，定義哪些元素需要套用之後的樣式。property為屬性表示要套用哪些樣式，value就是樣式的具體值。 而這裡的selector就是今天的主角。在w3school的教程中將選擇器分成了各個種類，例如id選擇器，屬性選擇器，在selenium的實際運用中都是混合起來才能定位，所以先上語法定義，然後具體舉例幫助理解。
選擇器
例子
例子描述
.class
.intro 選擇
class="intro"
的所有元素。
#id#firstname 選擇
id="firstname"
的所有元素。 *
*選擇所有元素。
elementp
選擇所有
元素。
element
,element
div,p
選擇所有
元素和所有
元素。
element
element
div p 選擇
元素內部的所有
元素。
element 選擇器" rel="noopener noreferrer">element
>element
div>p
選擇父元素為
元素的所有
元素。
element
+element
div+p
選擇緊接在
元素之後的所有
元素。
[attribute]
[target]
選擇帶有
target
屬性所有元素。
[attribute=value]
[target=_blank] 選擇
target="_blank"
的所有元素。
[attribute~=value]
[title~=flower] 選擇
title
屬性包含單詞
"flower"
的所有元素。
element1
~element2
p~ul
選擇前面有
元素的每個
元素。
選擇其src
屬性值以
開頭的每個
元素。
[attribute$=value]
a[src$=".pdf"]
選擇其src
屬性以".pdf"
結尾的所有
元素。
[attribute*=value]
a[src*="abc"]
選擇其src
屬性中包含
"abc"
子串的每個
元素。
:first-of-type
p:first-of-type
選擇屬於其父元素的首個
元素的每個
元素。
:last-of-type
p:last-of-type
選擇屬於其父元素的最後
元素的每個
元素。
:only-of-type
p:only-of-type
選擇屬於其父元素唯一的
元素的每個
元素。
:only-child
p:only-child
選擇屬於其父元素的唯一子元素的每個
元素。
:nth-child(n)
p:nth-child(2)
選擇屬於其父元素的第二個子元素的每個
元素。
:nth-last-child(n)
p:nth-last-child(2)
同上，從最後乙個子元素開始計數。
:nth-of-type(n)
p:nth-of-type(2)
選擇屬於其父元素第二個
元素的每個
元素。
:nth-last-of-type(n)
p:nth-last-of-type(2)
同上，但是從最後乙個子元素開始計數。
:last-child
p:last-child
選擇屬於其父元素最後乙個子元素每個
元素。
:root
:root
選擇文件的根元素。
:empty
p:empty
選擇沒有子元素的每個
元素（包括文字節點）。
:not(selector)
:not(p)
選擇非元素的每個元素。
舉例：p.content: 選擇所有class為content的元素，也可以寫成p[class="content"]
div#id1>p.content：在id為id1的div的子元素中選在所有class為content的元素
input[class='btn'][type='submit']: 選擇所有class為btn且type為submit的所有元素
第1個p
第2個p
第1個span
第3個p
第2個span
span:nth-of-type(1): 在同級的兄弟元素中選擇第乙個span元素
span:nth-of-child(3): 選擇作為第三個子元素，且是span的元素
這裡有個問題， p:nth-child(3)會找到哪個元素呢？答案是沒有。在這段html中第三個子元素是span不是p，所以不會找到任何元素。而span:nth-of-type(2）會匹配到第二個span元素。相信能夠理解nth-of-type和nth-of-child的用法了。
p1
p2p3
p4p5
p~p: 會選擇到p2,p3,p4,p5, 表示同級元素中所有前面有p元素的p元素
這裡把常用的以及幾個比較容易混淆難懂的語法用例子解釋了一下，希望看了之後能對css選擇器有個大致的了解
jQuery選擇器之全選擇器（ 選擇器）
在css中，經常會在第一行寫下這樣一段樣式 萬用字元 意味著給所有的元素設定預設的邊距。jquery中我們也可以通過傳遞 選擇器來選中文件頁面中的元素 描述 拋開jquery，如果要獲取文件中所有的元素，通過document.getelementsbytagname 中傳遞 同樣可以獲取到 不難發現...
jQuery選擇器之全選擇器（選擇器）
jquery選擇器之全選擇器 選擇器 在css中，經常會在第一行寫下這樣一段樣式 萬用字元 意味著給所有的元素設定預設的邊距。jquery中我們也可以通過傳遞 選擇器來選中文件頁面中的元素 描述 拋開jquery，如果要獲取文件中所有的元素，通過document.getelementsbytagna...
Css選擇器 層次選擇器（關係選擇器）
1.e f 匹配 e 元素下所有的子元素 f 後代選擇器 eg css.box a匹配 box 下所有的子元素 a 2.e f 匹配 e 元素下第一級子元素 f 子選擇器 eg css.box a匹配 box 下第一級子元素 a 3.e f 匹配 e 元素後面緊鄰的哪乙個 f 元素 有且僅有乙個 相...