CSS继承:覆盖作为后代选择器的父选择器

前端之家收集整理的这篇文章主要介绍了CSS继承:覆盖作为后代选择器的父选择器前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何在不更改或删除父选择器的情况下使此链接使用子选择器? (我希望链接为蓝色.)
<html>
    <head>
        <style>
            .parent a { color:Red; }
            .child { color:Blue; }
        </style>
    </head>
    <body>
        <div class="parent">
            <a class="child" href="http://www.stackoverflow.com">
                stackoverflow
            </a>
        </div>
    </body>
</html>

令我惊讶的是,在这种情况下,父母会覆盖孩子!

解决方法

使用a.child作为选择器.
<html>
    <head>
        <style>
            .parent a { color:Red; }
            a.child { color:Blue; }
        </style>
    </head>
    <body>
        <div class="parent">
            <a class="child" href="http://www.stackoverflow.com">
                stackoverflow
            </a>
        </div>
    </body>
</html>

猜你在找的CSS相关文章