學習python寫爬蟲的時候,遇到css定位問題,故小結一下css選擇器定位的方式
萬用字元選擇器:
*匹配所有class = 『important』
*.important去掉前面萬用字元也是一樣的。
匹配所有p標籤下class = 『important』
p.important匹配class = 『important warning』,類名中存在空格分開的情況
.important.warning
匹配所有id = 『intro』
#intro
匹配所有屬性是title
*[title]匹配所有a標籤下屬性名是href
a[href]多屬性匹配
a[href][title]xml文件也可以實行屬性匹配器
planet[moons]
匹配a標籤下href = 『 』
a[href=""]匹配多屬性值的情況
a[href=""][title="w3school"]xml文件也可以實行『屬性 』和 『值』 進行匹配器
planet[moons="1"]
使用『~』,匹配多個p標籤下class名中含有『important』
p[class~="important"]
下表是對這些選擇器的簡單總結:
型別描述
[abc^="def"]
選擇 abc 屬性值以 "def" 開頭的所有元素
[abc$="def"]
選擇 abc 屬性值以 "def" 結尾的所有元素
[abc*="def"]
選擇 abc 屬性值中包含子串 "def" 的所有元素
匹配a標籤下,所有href 中,包含 『w3school.com.cn』的鏈結
a[href*="w3school.com.cn"]匹配所有lang屬性下以『en』或以『en-』開頭的所有元素,例如:『en』,『en-us』,『en-au』,不適用『enen』
*[lang|="en"]選擇器
描述[attribute]
用於選取帶有指定屬性的元素。
[attribute=value]
用於選取帶有指定屬性和值的元素。
[attribute~=value]
用於選取屬性值中包含指定詞彙的元素。
[attribute|=value]
用於選取帶有以指定值開頭的屬性值的元素,該值必須是整個單詞。
[attribute^=value]
匹配屬性值以指定值開頭的每個元素。
[attribute$=value]
匹配屬性值以指定值結尾的每個元素。
[attribute*=value]
匹配屬性值中包含指定值的每個元素。
後代選擇器(descendant selector)又稱為包含選擇器。
匹配的所有元素,兩個元素間隔可以是無限的
h1 em
只匹配的多有元素,兩個元素間不能有間隔
h1 > strong匹配table標籤下class = company,此類結構的所有元素
hello
table.company td > p匹配相同父標籤下,h1和p的所有元素
h1 + p注:h1和p必須由相同的父標籤
html > body table + ul
匹配第乙個p標籤或第乙個li標籤
p:first-child匹配所有p標籤下,第乙個li標籤li:first-child
p > i:first-child
匹配第乙個p標籤下的所有li標籤
p:first-child i
css選擇器 小結
coding utf8 css selector info 選擇 class intro 的所有元素 name 選擇 id name 的所有元素 所有元素 div 選擇所有div div,p 選擇所有div和p div p 選擇div內部的p div p 選擇父元素為 元素的所有 元素 div p ...
CSS選擇器小結
基礎選擇器包括三種 html標籤選擇器,class選擇器和id選擇器三種。html標籤選擇器的使用 直接寫出html標籤名,例如 p 代表將文件中所有的p元素內部的文字渲染成紅色。class選擇器 加class名,例如 class id選擇器 加id名,例如 id 綜合選擇器,顧名思義就是將基礎選擇...
CSS的選擇器小結
css中的選擇器分為標籤選擇器 類選擇器和id選擇器 p.類選器名稱在使用類選擇器前先要為標籤設定乙個類,如 id選擇器 類似於類選擇器,不同的是id選擇器是唯一的,格式為 id選器名稱id選擇器同樣需要設定乙個id,如 選擇器是有 輩分關係 的,一代套著一代 子選擇器 子選擇器是父子關係,頗象是大...