麻烦老师看下这四种方式是否可以 代码是否有改进的地方 谢谢
来源:3-24 项目作业
dww1
2021-06-16 01:00:26
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
/* 序号选择器 */
p:nth-of-type(odd){
color: red;
}
p:nth-of-type(even){
color: green;
}
/* 属性选择器 */
p[class="red"]{
color: red;
}
p[class="green"]{
color: green;
}
/* 复合选择器 */
ul{
list-style: none;
}
ul li{
color: red;
}
ul li.g{
color: green;
}
/* 元素关系选择器 */
.box>p{
color: red;
}
p+.g{
color: green;
}
</style>
</head>
<body>
<h3>序号选择器</h3>
<p class="red">我是红色的</p>
<p class="green">我是绿色的</p>
<p class="red">我是红色的</p>
<p class="green">我是绿色的</p>
<p class="red">我是红色的</p>
<p class="green">我是绿色的</p>
<h3>属性选择器</h3>
<p class="red">我是红色的</p>
<p class="green">我是绿色的</p>
<p class="red">我是红色的</p>
<p class="green">我是绿色的</p>
<p class="red">我是红色的</p>
<p class="green">我是绿色的</p>
<div>
<h3>复合选择器</h3>
<ul>
<li>我是红色的</li>
<li class="g">我是绿色的</li>
<li>我是红色的</li>
<li class="g">我是绿色的</li>
<li>我是红色的</li>
<li class="g">我是绿色的</li>
</ul>
</div>
<div class="box">
<h3>元素关系选择器</h3>
<p>我是红色的</p>
<p class="g">我是绿色的</p>
<p>我是红色的</p>
<p class="g">我是绿色的</p>
<p>我是红色的</p>
<p class="g">我是绿色的</p>
</div>
</body>
</html>
1回答
好帮手慕星星
2021-06-16
同学你好,这四种方式都是正确的,很棒哦,不需要修改。
祝学习愉快!
相似问题
回答 1
回答 3