CSS 分組 和 嵌套 選擇器
CSS?分組?和?嵌套?選擇器
分組選擇器
在樣式表中有很多具有相同樣式的元素，為了盡量減少代碼，你可以使用分組選擇器。每個選擇器用逗號分隔。
實例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
<style>
h1,h2,p
{
color:green;
}
</style>
</head>
<body>
<h1> PHP中文網(wǎng)你</h1>
<h2>php.cn</h2>
<p>學(xué)習(xí)PHP知識的好選擇.</p>
</body>
</html>運行程序嘗試一下
嵌套選擇器
它可能適用于選擇器內(nèi)部的選擇器的樣式。
在下面的例子設(shè)置了三個樣式：
為所有p元素指定一個樣式為所有class="marked"的元素指定一個樣式為所有class="marked"元素內(nèi)的p元素指定一個樣式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
<style>
p
{
color:blue;
text-align:center;
}
.marked
{
background-color:red;
}
.marked p
{
color:white;
}
</style>
</head>
<body>
<p>褪盡風(fēng)華，我依然在彼岸守護(hù)你</p>
<div class="marked">
<p>那些繁華哀傷終成過往，</p>
</div>
<p>請不要失望，平凡是為了最美的蕩氣回腸。</p>
</body>
</html>運行程序嘗試一下
