css復合選擇器
復合選擇器是由兩個或多個基礎選擇器,通過不同的方式組合而成的,目的是為了可以選擇更準確更精細的目標元素標籤。
交集選擇器
交集選擇器由兩個選擇器構成,其中第乙個為標籤選擇器,第二個為class選擇器,兩個選擇器之間不能有空格,如h3.special。
記憶技巧:
交集選擇器 是 並且的意思。 即…又…的意思
比如: p.one 選擇的是: 類名為 .one 的 段落標籤。
用的相對來說比較少,不太建議使用。
並集選擇器
並集選擇器(css選擇器分組)是各個選擇器通過逗號連線而成的,任何形式的選擇器(包括標籤選擇器、class類選擇器id選擇器等),都可以作為並集選擇器的一部分。如果某些選擇器定義的樣式完全相同,或部分相同,就可以利用並集選擇器為它們定義相同的css樣式。
記憶技巧:
並集選擇器 和 的意思, 就是說,只要逗號隔開的,所有選擇器都會執行後面樣式。
比如 .one, p , #test 表示 .one 和 p 和 #test 這三個選擇器都會執行顏色為紅色。 通常用於集體宣告。
他和他,在一起, 在一起 一起的意思
後代選擇器
後代選擇器又稱為包含選擇器,用來選擇元素或元素組的後代,其寫法就是把外層標籤寫在前面,內層標籤寫在後面,中間用空格分隔。當標籤發生巢狀時,內層標籤就成為外層標籤的後代。
子孫後代都可以這麼選擇。 或者說,它能選擇任何包含在內 的標籤。
子元素選擇器
子元素選擇器只能選擇作為某元素子元素的元素。其寫法就是把父級標籤寫在前面,子級標籤寫在後面,中間跟乙個 進行連線,注意,符號左右兩側各保留乙個空格。
白話: 這裡的子 指的是 親兒子 不包含孫子 重孫子之類。
比如: .demo > h3 說明 h3 一定是demo 親兒子。 demo 元素包含著h3。
在不修改以上**的前提下,完成以下任務:
鏈結 登入 的顏色為紅色,同時主導航欄裡面的所有的鏈結改為橙色 (簡單)
主導航欄和側導航欄裡面文字都是14畫素並且是微軟雅黑。(中等)
主導航欄裡面的一級選單鏈結文字顏色為綠色。(難)
偽類選擇器
偽類選擇器用於向某些選擇器新增特殊的效果。比如給鏈結新增特殊效果, 比如可以選擇 第1個,第n個元素。
為了和我們剛才學的類選擇器相區別, 類選擇器是乙個點 比如 .demo {} 而我們的偽類 用 2個點 就是 冒號 比如 :link{}
鏈結偽類選擇器 CSS選擇器 復合選擇器
選擇器 名稱 說明 css 版本 通用選擇器 選擇所有元素 2元素選擇器 選擇指定型別的元素1 id 選擇器 選擇指定 id 屬性的元素1.class 選擇器 選擇指定 class 屬性的元素 1 attr 系列 屬性選擇器 選擇指定 attr 屬性的元素 2 3 s1,s2,s3 分組選擇器 選擇...
CSS 復合選擇器
以前介紹了3種 標記選擇器 類別選擇器 id選擇器 基本的選擇器,以這3種基本選擇器為基礎,通過組合,還可以產生更多種類的選擇器,實現更強 更方便的選擇功能,復合選擇器就是由基本選擇器通過不同的連線方式構成的。復合選擇器就是兩個或多個基本選擇器,通過不同方式連線而成的選擇器。1.交集 選擇器 交集 ...
CSS復合選擇器
div span 又稱包含選擇器,用來選擇元素或元素組的後代,其寫法就是把外層標籤寫在前面,內層標籤寫在後面,中間 用空格分隔。當標籤發生巢狀時,內層標籤就成為外層標籤的後代。div span 由兩個選擇器構成,第乙個選擇器是標籤選擇器 也可以是其他的選擇器 第二個選擇器是class選擇器,兩個選擇...