<style>
/* 后代选择器
空格就表示后代，*.box* p 就是.box的后代所有的p。
特点：可以把修饰的标签，指定到 某个区域里。 */
/* 0-"#" 1="." 3-"标签" */
.box ul li p{
color: pink;
}
/* 0 1 1 */
.box p{
color: aquamarine;
}
.box p span{
color: rgb(255, 202, 202);
text-decoration: underline;
}
/* 后代选择器，修饰的内容 是某一 制定范围内的 所有的元素的样式
后代选择器 会把修饰的范围缩小 */
.box a{
color: blueviolet;
text-decoration: none;
}
.box a:hover{
color: brown;
text-decoration: underline;
}
</style>
</head>
<body>
<div class="box">
<ul>
<li>
<p>段落</p>
<p>段落<span>100</span></p>
<p>段落<span>200</span></p>
</li>
</ul>
</div>
<a href="">你好</a>
<a href="">嘿嘿</a>
<div class="box">
<a href="">你好</a>
<a href="">你好</a>
<a href="">你好</a>
</div>
</body>
效果图：
<style>
h3{
font-size: 30px;
}
/* 交集选择器 交集选择器没有空格
选择的元素是同时满足两个条件：必须是h3标签，然后必须是special标签*/
h3.red{
color: red;
}
</style>
</head>
<body>
<h3 class="red">我是标题3标签</h3>
<h3>我是标题3标签</h3>
<h3>我是标题3标签</h3>
<h3 class="red">我是标题3标签</h3>
<h3 class="red">我是标题3标签</h3>
<p class="red">this is my life</p>
<p class="red">this is my life</p>
<p class="red">this is my life</p>
</body>
效果图：
<style>
p,div,em{
/* 并集选择器(分组选择器)
用逗号就表示并集。多个标签，使用一样的样式规则。我们就使用并集选择器。
有多个不同的标签，想给这些标签，设置相同的样式规则，
我就把他们用并集选择器 写在一起。 */
/* 某些指定的标签，设置相同的样式规则，我们可以使用并集选择器去修饰它们 */
font-size: 50px;
font-style: normal;
}
.box1,.box2{
color: rgb(26, 69, 107);
background-color: pink;
}
</style>
</head>
<body>
<p>小红</p>
<div>小花</div>
<em>小紫</em>
<div class="box1">盒子1</div>
<div class="box2">盒子2</div>
</body>
效果图：
2942
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
