CSS復合選擇器

**復合選擇器 **是由兩個或多個基礎選擇器，通過不同的方式組合而成的,目的是為了可以選擇更準確更精細的目標元素標籤。

交集選擇器由兩個選擇器構成，其中第乙個為標籤選擇器，第二個為class選擇器，兩個選擇器之間不能有空格。

<

!doctype html>
"en"
>
"utf-8"
>
"viewport" content=
"width=device-width, initial-scale=1.0"
>
交集選擇器 <
/title>
/* 交集選擇器用法是標籤名+類名 使用較少 特殊情況使用 */
/* div.bule 的意思是只指定div標籤下的類名叫 blue 的內容 所以p標籤類名雖然相同但是不起作用 */
div.blue
<
/style>
<
/head>
你不許給我變顏色<
/div>
="blue"
>
你給我變個顏色試試<
/p>
<
/div>
="blue"
>我賭你不能給我變顏色<
並集選擇器（css選擇器分組）是各個選擇器通過逗號連線而成的，任何形式的選擇器（包括標籤選擇器、class類選擇器id選擇器等），都可以作為並集選擇器的一部分。如果某些選擇器定義的樣式完全相同，或部分相同，就可以利用並集選擇器為它們定義相同的css樣式。
<
!doctype html>
"en"
>
"utf-8"
>
"viewport" content=
"width=device-width, initial-scale=1.0"
>
並集選擇器<
/title>
<
!-- 並集選擇器目的是集體宣告，減少重複寫類名，寫法 所有標籤名用逗號隔開，可以理解為 我們都需要這個樣式，這個選擇器使用較多，多使用在樣式初始化
(清除預設樣式)
-->
<
!-- 需求：使 div span 標籤變成紅色，h1 p 變成藍色 --
>
div,span 
h1,p 
<
/style>
<
/head>
我想變成紅色<
/div>
我也想變成紅色<
/span>
/h1>
我也想<
後代選擇器又稱為包含選擇器，用來選擇元素或元素組的後代，其寫法就是把外層標籤寫在前面，內層標籤寫在後面，中間用空格分隔。當標籤發生巢狀時，內層標籤就成為外層標籤的後代。
<
!doctype html>
"en"
>
"utf-8"
>
"viewport" content=
"width=device-width, initial-scale=1.0"
>
後代選擇器<
/title>
/* 標籤選擇器會選取全域性div */
div 
/* 後代選擇器能定義子類屬性 在基本的標籤選擇器後面加上空格在加上子標籤*/
div p 
/* 但會有另一種情況，例如ul和ol下面會出現相同的li標籤可以用另一種選擇方式 父級標籤類選擇器class定義， 選擇器類名+子標籤 */
.fh li 
<
/style>
<
/head>
大話西遊<
/div>
王者榮耀<
/div>
我是後代選擇器<
/p>
<
/div>
水果<
/li>
<
/ul>
="fh"
>
蘋果<
子元素選擇器只能選擇作為某元素子元素的元素。其寫法就是把父級標籤寫在前面，子級標籤寫在後面，中間跟乙個 > 進行連線，注意，符號左右兩側各保留乙個空格。
子 指的是親兒子 不包含孫子 重孫子之類。
<
!doctype html>
"en"
>
"utf-8"
>
"viewport" content=
"width=device-width, initial-scale=1.0"
>
子代選擇器<
/title>
/* 要求：一級選單紅色 二級選單藍色並且沒有下劃線 */
ul > li > a 
ul > li > div > a 
<
/style>
<
/head>
"#">一級選單<
/a>
<
/li>
"#">二級選單<
/a>
"#">二級選單<
/a>
"#">二級選單<
偽類選擇器用於向某些選擇器新增特殊的效果。
<

"en"

>

"utf-8"

>

"viewport" content=

"width=device-width, initial-scale=1.0"

>

偽類鏈結<

/title>

/* 未訪問過的鏈結 */

a:link

/* 訪問過的鏈結 */

a:visited

/* 滑鼠移動上去的鏈結 */

a:hover

/* 滑鼠選定下的鏈結 */

a:active

<

/style>

<

/head>

"#">我是鏈結<

/a>

<

/body>

<

/html>

CSS選擇器 復合選擇器

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

CSS 復合選擇器

以前介紹了3種 標記選擇器 類別選擇器 id選擇器 基本的選擇器，以這3種基本選擇器為基礎，通過組合，還可以產生更多種類的選擇器，實現更強 更方便的選擇功能，復合選擇器就是由基本選擇器通過不同的連線方式構成的。復合選擇器就是兩個或多個基本選擇器，通過不同方式連線而成的選擇器。1.交集 選擇器 交集 ...

CSS復合選擇器

css復合選擇器 復合選擇器是由兩個或多個基礎選擇器，通過不同的方式組合而成的,目的是為了可以選擇更準確更精細的目標元素標籤。交集選擇器 交集選擇器由兩個選擇器構成，其中第乙個為標籤選擇器，第二個為class選擇器，兩個選擇器之間不能有空格，如h3.special。記憶技巧 交集選擇器 是 並且的意...