大聚會 CSS選擇器

2021-10-09 15:27:34 字數 1254 閱讀 2248

偽類選擇器

鏈結偽類選擇器(重點)

在css中,乙個星號*就是乙個通配選擇器.它可以匹配任意型別的html元素.

html標籤名稱作為選擇器,按標籤名稱分類,為頁面中某一類標籤指定統一的css樣式。

使用「.」(英文點號)進行標識,後面緊跟類名。和標籤內的class屬性搭配使用。

使用#進行標識,後面緊跟id名,和標籤內的class屬性搭配使用。

元素的id值是唯一的,只能對應於文件中某乙個具體的元素。

交集選擇器由兩個選擇器構成,有標籤一的特點,也有標籤二的特點。

其中第乙個為標籤選擇器,第二個為class選擇器,兩個選擇器之間不能有空格

第乙個標籤、第二個標籤可以為id選擇器類選擇器

各個選擇器通過,連線而成的。某些選擇器定義的相同樣式,就可以利用並集選擇器,可以讓**更簡潔。

用來選擇元素或元素組的子孫後代《親兒子、孫子…只要是器父級的後代》

把外層標籤寫在前面,內層標籤寫在後面,中間用空格分隔

只能選擇作為某元素**子元素(親兒子)**的元素。

中間用>分割

css2的基礎上拓展、新增的樣式

選擇符簡介

e:first-child

匹配父元素中的第乙個子元素e

e:last-child

匹配父元素中的最後乙個子元素e

e:nth-child(n)

匹配父元素中的第n個子元素e

e:nth-last-child(n)

從後開始數,匹配父元素中的第n個子元素e

e:first-of-type

選擇指定型別e元素的第乙個

e:last-of-type

選擇指定型別e元素的最後乙個

e:nth-of-type(n)

選擇指定型別e元素的第n個

e:nth-last-of-type()

從後開始數,選擇指定型別e元素的第n個

選擇符簡介

e::before

在元素內容的前面插入內容

e::after

在元素內容的後面插入內容

css選擇器 CSS選擇器總結

在前不久的專案中,實習小妹妹在乙個全域性的樣式中使用了下面這個css選擇器 content 對應的html結構大致是 實習妹子大致的意思是想要讓content下的子元素div的高度100 但是貌似她沒有真正理解first child的意義,從而導致這個全域性的樣式讓 所有頁面都出現了問題,然後我就只...

CSS選擇器 復合選擇器

選擇器 名稱 說明 css 版本 通用選擇器 選擇所有元素 2元素選擇器 選擇指定型別的元素1 id 選擇器 選擇指定 id 屬性的元素1.class 選擇器 選擇指定 class 屬性的元素 1 attr 系列 屬性選擇器 選擇指定 attr 屬性的元素 2 3 s1,s2,s3 分組選擇器 選擇...

CSS選擇器 屬性選擇器

最近重新學習了css3,發現選擇器還能這麼玩。介紹一下屬性選擇器 我給咱們順著往下縷一縷 資訊量挺大 剛開始是這樣子 如下 doctype html head meta charset utf 8 title 測試網頁 title style h1 m1 style head body div h1...