CSS 分组 和 嵌套 选择器
CSS 分组 和 嵌套 选择器
分组选择器
在样式表中有很多具有相同样式的元素，为了尽量减少代码，你可以使用分组选择器。每个选择器用逗号分隔。
实例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<style>
h1,h2,p
{
color:green;
}
</style>
</head>
<body>
<h1> PHP中文网你</h1>
<h2>php.cn</h2>
<p>学习PHP知识的好选择.</p>
</body>
</html>运行程序尝试一下
嵌套选择器
它可能适用于选择器内部的选择器的样式。
在下面的例子设置了三个样式：
为所有p元素指定一个样式为所有class="marked"的元素指定一个样式为所有class="marked"元素内的p元素指定一个样式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<style>
p
{
color:blue;
text-align:center;
}
.marked
{
background-color:red;
}
.marked p
{
color:white;
}
</style>
</head>
<body>
<p>褪尽风华，我依然在彼岸守护你</p>
<div class="marked">
<p>那些繁华哀伤终成过往，</p>
</div>
<p>请不要失望，平凡是为了最美的荡气回肠。</p>
</body>
</html>运行程序尝试一下
女神的闺蜜爱上我
这样也可以啊。。。
8年前 添加回复 0