關於CSS選擇器

關於css選擇器部分摘自另一博友博文：

關於css選擇器：

css基本語法

1元素選擇器：

直接選擇文件元素

比如head，p

2 類選擇器：

元素的class屬性，比如

類名就是important

.important選擇所有有這個類屬性的元素

可以結合元素選擇器，比如p.important

3 id選擇器：

元素的id屬性，比如

id就是intro

#intro用於選擇id=intro的元素

可以結合元素選擇器，比如p#intro

4 屬性選擇器：

選擇有某個屬性的元素，而不論值是什麼。

*[title]選擇所有包含title屬性的元素

a[href]選擇所有帶有href屬性的錨元素

還可以選擇多個屬性，比如：a[href][title]，注意這裡是要同時滿足。

限定值：a[href="www.so.com"]

5 後代（包含）選擇器：

選擇某元素後代的元素（層級不受限制）

選擇h1元素的em元素：h1 em

6 子元素選擇器：

範圍限制在子元素

選擇h1元素的子元素strong：h1 > strong

例1：列印元素的型別和名稱

print(type(soup.title))
print(soup.title.name)

例2：選擇所有的title標籤

print(soup.title)
print(soup.title.string) # 只列印文字
print(soup.select('title'))

例3：選擇所有的p標籤中的第1個

print(soup.select('p')[1])

例4：選擇body標籤下的所有a標籤

items = soup.select('body a')
for item in items:
print(item)

例5：選擇body標籤下的直接子元素標籤a

print(soup.select('body > a'))
print(soup.select('p > a'))

例6：選擇id=link1後的所有兄弟節點標籤。類名前加點，id名前加#

items = soup.select('#link1 ~ .sister')
for item in items:
print(item)

print(soup.select('#link1 + .sister'))

例1：查詢class類名為sister的標籤。

items = soup.select('.sister')
for item in items:
print(item)

例2：查詢p標籤下class類名為title的標籤。

items = soup.select('p.title')
for item in items:
print(item)

例1：選擇id屬性為link2的所有標籤。

print(soup.select('#link2'))

例2：選擇a標籤，其id屬性為link2的標籤。

print(soup.select('a#link2'))

例1：選擇id屬性為link2和id屬性為link3的所有標籤。

items = soup.select('#link2, #link3')
for item in items:
print(item)

例2：選擇class屬性為title，id屬性為link2和id屬性為link3的所有標籤。

items = soup.select('.title, #link2, #link3')
for item in items:
print(item)

例：查詢a標籤下存在herf屬性的標籤。

items = soup.select('a[href]')
for item in items:
print(item)

例1：選擇a標籤，其屬性href=的所有標籤。

items = soup.select('a[href=""]')

for item in items:

print(item)

例2：選擇a標籤，其href屬性以http開頭的所有標籤。

print(item)例3：選擇a標籤，其href屬性以lie結尾的所有標籤。

items = soup.select('a[href$="lie"]')
for item in items:
print(item)

例4：選擇a標籤，其href屬性包含.com的標籤。

items = soup.select('a[href*=".com"]')
for item in items:
print(item)

例1：首先選中所有的p標籤中的第2個標籤，然後在該標籤中查title的屬性值為12的標籤。

mytag = soup.select('p')[1]
na_name = mytag.select('[title="12"]')
print(na_name)

例2：首先選中所有的p標籤中的第2個標籤，然後在該標籤列表中查詢a標籤，並將該列表中的第2個標籤的文字取出。

mytag = soup.select('p')[1]

href_text = mytag.select('a')[1].get_text()

print(href_text)

例：選擇class類名為sister的所有標籤中的第乙個。

print(soup.select_one('.sister'))

關於CSS選擇器

通用選擇器這個選擇器不經常用，看著省事，問題也有。標籤選擇器 html標籤都可以進行設定，但是常用的如ul，li，a標籤等最好還是給乙個class或者id，乙個頁面中如果有多個相同標籤，容易混淆。類選擇器類選擇器用得比較多，也比較方便。同乙個類名可以賦給多個標籤，同樣設定了樣式也可以進行重複使用...

關於CSS選擇器

css選擇器是css規則的一部分，它能夠告訴瀏覽器，相應的html元素的樣式規則。id選擇器，類選擇器，元素選擇器屬性選擇器屬性選擇器只對存在屬性的html元素有效，常見標籤的href屬性 url a href 偽類和偽元素選擇器 article 組合器選擇器 important style行內...

關於CSS實戰，選擇器

平時習慣用的一些選擇器整理出來，id選擇器 banner p.intro a 請將該樣式應用給應用了intro類的段落 p 所派生的每個鏈結a,注意在p和.intro之間沒有空格這是在告訴css,這個 intro類必須專用於這個標籤才有效。p intro a 以.intro類定義了樣式的任何...

關於CSS選擇器

關於CSS選擇器

關於CSS選擇器

關於CSS實戰，選擇器

相關推薦