各位大佬,css子类选择器为什么把后面的也选上了
html吧
全部回复
仅看楼主
level 1
RT,正常来说应该只修改一级菜单的样式,为什么呢把二级菜单的样式也改变了[疑问]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<base target="_blank"/>
<style>
/*我们使用子类选择器来选择,用 > 分割开来,中间还需要加空格只能影响到 > 后面的标签*/
.item > li {
color: red;
}
</style>
</head>
<body>
<ul class="item">
<li>一级菜单1
<ol>
<li>二级菜单</li>
<li>二级菜单</li>
<li>二级菜单</li>
</ol>
</li>
<li>一级菜单2
<ol>
<li>二级菜单</li>
<li>二级菜单</li>
<li>二级菜单</li>
</ol>
</li>
</ul>
</body>
</html>
2020年01月25日 10点01分 1
level 1
继承
2020年01月26日 15点01分 2
level 5
color属性是可以继承的哦
2020年01月30日 05点01分 5
level 1
谢谢以上吧友,已经明白了[吐舌]
2020年01月30日 15点01分 6
level 5
你是不是想要这样效果:
代码如下:
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>列表颜色</title>
<base target="_blank"/>
<style type="text/css">
ul {
color: red;
}
ol{color:blue;}
</style>
</head>
<body>
<h3>列表颜色实例</h3>
<ul class="item">
<li>一级菜单1
<ol >
<li>二级菜单</li>
<li>二级菜单</li>
<li>二级菜单</li>
</ol>
</li>
<li>一级菜单2
<ol>
<li>二级菜单</li>
<li>二级菜单</li>
<li>二级菜单</li>
</ol>
</li>
</ul>
</body>
</html>
在这个实例中,你直接在css 样式中改变ul 和ol 的颜色就可以达到效果。
2020年02月06日 09点02分 7
1