选择器使用的例子：
<!--为注释内容-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
ul li a{color: red;}
<!--标签选择器 -->
article>h3{color: green;}
<!--子代选择器 -->
p+br,h3+p{color: yellow;}
<!--相邻兄弟选择器和分组选择器 -->
</style>
</head>
<body>
<header>
<h1 align="center">周生如故</h1>
<p align="center">主演：<ins>白鹿、任嘉伦</ins></p>
<hr>
<nav>
<ul type="none">
<li><a href="#">剧情简介</a></li>
<li><a href="#">演员表</a></li>
<li><a href="#">人物结局</a></li>
<li><a href="#">人物关系表</a></li>
</ul>
</nav>
</header>
<hr>
<main>
<section>
<h2>台词</h2>
<article>
<h3>比如</h3>
<p>辰此一生<br>不负天下<br>为负十一</p>
<br><br><br>
<img src="https://tse1-mm.cn.bing.net/th/id/OIP-C.cMMMyq35XoVVgk2Bn-4v2wHaKI?w=208&h=285&c=7&r=0&o=5&dpr=1.3&pid=1.7" alt="" width="300" height="400">
<p>想了解更多<a href="https://weibo.com/u/5215482174">点击这里</a></p>
</article>
<br>
<aside>
<h3>侧边栏</h3>
<p>各演员信息</p>
<table border="1">
<tr>
<th>人物介绍</th>
<th>链接</th>
</tr>
<tr>
<td>周生辰</td>
<td><a href="1.2\周生辰.html">人物介绍</a></td>
</tr>
<tr>
<td>漼时宜</td>
<td><a href="1.2\漼时宜.html">人物介绍</a></td>
</tr>
</table>
</aside>
</section>
</body>
</html>
运行结果：
之前没加选择器的：
可对比一下
（注：最后一张图，作者在HTML总应用那里有的完整代码）
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
