初识CSS-子代选择符

我们上次学习了后代选择符,如图:

<style>
    body h2{
        color:red;
}
</style>

<body>
    <h2>asd</h2>
    <div>
        <h2>qwe</h2>
        <p>asd</p>
    </div>
   
</body>

这样的话当前页面下的所有h2标签中的内容都会变成红色,

但是我们如果不想让全部h2变成红色,我们就可以使用子代选择符

子代选择符仅选择直接子元素,语法:body>h2

<style>
        body>h2{
            color: red;
        }
    </style>

这样,只有第一个h2元素变成了红色,div中的h2元素保持不变

猜你喜欢

转载自blog.csdn.net/qq_34987137/article/details/83515397