CSS型別選擇器

2021-07-13 09:21:43 字數 749 閱讀 6411

最常見的為標籤選擇器:

p{}、a{}、div{}......

類選擇器,即在標籤中新增class=「***」,呼叫的時候在類名前加「.」 如:

標籤:

呼叫:.first{}

id選擇器,即在標籤中新增id=「***」,呼叫的時候在id前加「#」,如:

標籤:

呼叫:#first{}

類選擇器與id選擇器看起來一樣,但是類選擇器可以建立多個,但是id選擇器只能建立乙個,是唯一的。

子選擇器,在乙個標籤(1)後加多乙個標籤(2),中間用「>」號連線,用於選擇標籤(1)中第乙個標籤(2),如:

標籤:一

二呼叫:p>span{}

此時新增css樣式,只會改變「一」,不會改變「二」

後代選擇器,在乙個標籤(1)後加多乙個標籤(2),中間用「 」(空格)號連線,用於選擇標籤(1)所有的標籤(2),如:

標籤:一

二呼叫:p span{}

此時新增css樣式,「一」跟「二」都會被改變

通用選擇器,選擇所有的標籤,用「*」代表所有標籤,如:

標籤: 文體

呼叫:*{}

此時新增css樣式,標題跟文字都會改變

分組選擇器,標籤(1)與標籤(2)與標籤(3)......中間用「,」(逗號)隔開,表示多個標籤都選擇,如:

標籤:

呼叫:h1,.first{}

此時新增css樣式,h1與類first會發生改變,而類second不會發生改變。

css 選擇器型別分類

今天回憶特殊性的時候,突然被大片的選擇器名稱搞混了。腦袋不好。還是整理下。首先是簡單的兩種選擇器 1,id選擇器,就是帶 的,只能在頁面裡被引用一次。2,類選擇器,就是帶.的,可以多次應用。3,其次是型別選擇器 也叫簡單選擇器 類似p a h1 div等等元素。4,屬性選擇器 abbr 5,偽類選擇...

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 分組選擇器 選擇...