li>p 紧跟着的子元素
.one+p 紧挨这得同级元素P
li ~ a 元素后所有同级的指定元素，强调所有的。
li div 所有的子元素div
<!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>
li>p {
color: red;
}
.one+li {
color: yellow;
}
li ~ a {
color: violet;
}
li div {
width: 50px;
background-color: aquamarine;
}
</style>
</head>
<body>
<ul>
<li>biji</li>
<a>s</a>
<li>biji
<p>w</p>
<div><p>a</p></div>
<p>w</p>
</li>
<li>biji</li>
<li>biji</li>
<li class="one">ggg</li>
<li>ggg<div>div</div></li>
<li>biji</li>
<li>biji</li>
<a>s</a>
</ul>
</body>
</html>
