css選擇器

css選擇器：一種快速定位元素的方法

基本用法<1>

*

選擇所有元素

.class

.intro 選擇所有class="intro"的元素

#id

#firstname 選擇所有id = "firstname"的元素

element

p 選擇所有<p>元素

:not(selector)

:not(p) 選擇所有非p元素的元素

基本用法<2>

element,element

div,p 選擇所有<div>和<p>元素

element element

div p 選擇<div>元素內的所有<p>元素（後代）

element>element

div>p 選擇所有父級是<div>的<p>元素（兒子）

element~element

p~ul 選擇p元素後的每一個ul（弟弟）

element+element

div+p 選擇所有緊跟<div>元素之後的<p>元素（第一個弟弟）

基本用法<3>

[attribute]

[target] 選擇所有帶有target屬性的元素

[attribute=value]

[target=_blank] 選擇所有使用target="_blank"屬性的元素

[attribute^=value]

a[src^="https"] 選擇每一個src屬性的值以"https"開頭的元素

[attribute$=value]

a[src$=".pdf"] 選擇每一個src屬性的值以".pdf"結尾的元素

[attribute*=value]

a[src*="skr"] 選擇每一個src屬性包含字串skr的元素

基本用法<4>

基本用法<5>

element.class 

p.skr 所有class="skr"的p元素