CSS 參考手冊

CSS @規(guī)則(RULES)

CSS 屬性大全

CSS > 子選擇器

使用 > 選擇符分隔兩個元素時,它只會匹配那些作為第一個元素的直接后代(子元素)的第二元素. 與之相比, 當兩個元素由后代選擇器相連時, 它表示匹配存在的所有由第一個元素作為祖先元素(但不一定是父元素)的第二個元素, 無論它在 DOM 中"跳躍" 多少次.

完整CSS選擇器參考手冊

在線示例

選擇所有父級是 <div> 元素的 <p> 元素：

示例

<!DOCTYPE html>
<html>
<title>菜鳥教程(cainiaoplus.com)</title>
<head>
<style>
div>p
{
background-color:red;
color:white;
}
div > span {background-color: DodgerBlue;}
</style>
</head>
<body>
<h1>歡迎來到菜鳥教程(www.jixiangtaizi.com.cn)</h1>
<div>
<p>我們的網址是：www.jixiangtaizi.com.cn.</p>
<p>我們的網站名稱是：菜鳥教程.</p>
<span>演示子選擇器</span>
</div>
<p>我們?yōu)槟峁└鞣N菜鳥教程學，學好基礎，你才能走的更遠！</p>
</body>
</html>

測試看看 ?/?

定義和用法

元素1 > 元素2 {樣式聲明 }

element>element 子選擇器用于選擇特定父元素。

注意: 元素沒有被選中是不能直接指定父級的子元素。

瀏覽器兼容性

IEFirefoxOperaChromeSafari

所有主流瀏覽器都支持 element>element 子選擇器。

注意:element>element在IE8中運行，必須聲明 <!DOCTYPE>