话不多说，直接代码
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="div.css">
</head>
<body>
<div>
<h1>沁园春·长沙</h1>
<p class="a1">独立寒秋，<a>湘江北去</a> ，橘子洲头。</p>
<p class="a2">看万山红遍，层林尽染，<a> 漫江碧透</a>，百舸争流。</p>
<p class="a3">鹰击长空，<a>鱼翔浅底</a>，万类霜天竞自由。</p>
<p class="a4">怅寥廓<a>，问苍茫大地，谁主沉浮？</a></p>
<p class="a5">携来百侣曾游，忆往昔峥嵘岁月稠。</p>
<p class="a6">恰同学少年，风华正茂；书生意气，挥斥方遒。</p>
<p class="a7">指点江山，激扬文字，粪土当年万户侯。</p>
<p class="a8"><a>曾记否，到中流击水，浪遏</a>飞   舟   ？</p>
</div>
</body>
</html>css代码
div{
width: 600px;
height: 300px;
margin: auto;
text-align: center;
/* font-weight: bold; */
/* line-height: 10px; */
}
.a1{
color: blue;
font-size: 20px;
}
.a1>a{
color: red;
font-size: 10px;
}
.a2{
color: red;
font-size: 20px;
}
.a2>a{
color: pink;
font-size: 10px;
}
.a3{
color: blue;
font-size: 20px;
}
.a3>a{
font-size: 10px;
}
.a4{
color: red;
font-size: 20px;
}
.a4>a{
color: green;
font-size: 25px;
}
.a5{
color: blue;
font-size: 20px;
}
.a6{
color: green;
font-size: 25px;
}
.a7{
color: blue;
font-size: 20px;
}
.a8{
color: red;
font-size: 25px;
}
.a8>a{
font-size: 20px;
}效果图
总体来说收获满满，复合选择器也是一个比较重要的知识点，我还需要加强学习
243
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
