选择器之二层次选择器

最新推荐文章于 2023-01-04 15:09:22 发布

VIP文章 Oliver叫喳喳

最新推荐文章于 2023-01-04 15:09:22 发布

阅读量537

点赞数 1

本文链接：https://blog.csdn.net/oliversongfly/article/details/81146383

版权

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <!--内部样式  写在head中-->
    <style type="text/css">
        /* 并集选择器  多个选择器之间使用,（英文半角状态）隔开
        .word,#s,span{
            color: green;
        }*/
        /*交集选择器  格式：01.标签选择器+类选择器   02.标签选择器+ID选择器
           必须是标签选择器在前
           div.word｛｝  去div标签中查找class属性值为 word的标签
           div#s{}  去div标签中查找id属性值为 s的标签
          div.word{
            color: green;
         } */
        /* 后代选择器  必须有层级关系 选择器之前使空格隔开*/
        #dv span {
            color: green;
        }

    </style>
</head>
<body>
<div>这是一个div1</div>
<div>这是一个div2</div>

<div class="word">类选择器</div>
<div class="word">类选择器</div>

<div id="s">ID选择器</div>
<span>div外面的span</span>

<div id="dv">
    <span>div里面的span标签1</span>
</div>

<div>
    <span>div里面的span标签2</span>
</div>

</body>
</html>

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>层次选择器</title>
    <style type="text/css">
        /*并集选择器*/
        p,ul{
           border: 1px solid red;
        }
     /* 后代选择器
        body p{

最低0.47元/天解锁文章

Oliver叫喳喳

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
选择器之二层次选择器

&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head lang="en"&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;!--内部样式写在head中--&gt; &lt;style type=&q
复制链接

扫一扫