CSS-包含选择器、后代选择器

我不是女神ヾ 2023-07-01 06:24 158阅读 0赞

说明：  
  
1.包含选择器也可以叫做后代选择器。利用父子级关系进行选择.  
2.父子级关系,从父级到子级的顺序，用空格分隔

<html>
    <head>
        <style>
        .div1 .div1-1 .div1-1-p{
            color: red;
        }
    
        .div2 .div2-1 .div2-1-p{
            color: blue;
        }
        </style>
    </head>
    <body>
        <div class="div1">
            <div class="div1-1">
                <p class="div1-1-p">包含选择器</p>
            </div>
        </div>
    
        <div class="div2">
            <div class="div2-1">
                <p class="div2-1-p">包含选择器2</p>
            </div>
        </div>
    
        <div class="div1-1">
            <p class="div1-1-p">包含选择器不能被渲染，应为缺少div1</p>
        </div>
    </body>
    </html>

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NpbmF0XzE2OTk4OTQ1_size_16_color_FFFFFF_t_70]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NpbmF0XzE2OTk4OTQ1_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200319190126856.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NpbmF0XzE2OTk4OTQ1,size_16,color_FFFFFF,t_70

发表评论取消回复

表情：

评论列表（有 0 条评论，158人围观）

还没有评论，来说两句吧...

相关阅读

相关【前端_层次选择器】子代选择器、后代选择器、兄弟选择器、相邻选择器

[CSDN话题挑战赛第2期][CSDN_2] 参赛话题：[学习笔记][Link 1] 学习之路，长路漫漫，写学习笔记的过程就是把知识讲给自己听的过程。这个过程中，我们去记

太过爱你忘了你带给我的痛/ 2024年04月06日 13:41/ 0 赞/ 107 阅读

相关复合选择器-后代选择器（HTML、CSS）

复合选择器-后代选择器（HTML、CSS） <!DOCTYPE html> <html lang="en"> <head>

左手的ㄟ右手/ 2023年10月03日 12:49/ 0 赞/ 45 阅读

相关 CSS-高级选择器，后代选择器、交集选择器、并集选择器，伪类选择器的用法详解

常见的高级选择器有后代选择器、交集选择器、并集选择器后代选择器选择器之间用空格隔开就是后代选择器选择的是后代元素，不一定是儿子元素，后代选择器描述的是

妖狐艹你老母/ 2023年08月17日 16:30/ 0 赞/ 151 阅读

相关 CSS-包含选择器、后代选择器

说明： 1.包含选择器也可以叫做后代选择器。利用父子级关系进行选择. 2.父子级关系,从父级到子级的顺序，用空格分隔 <html> <he

我不是女神ヾ/ 2023年07月01日 06:24/ 0 赞/ 159 阅读

相关 CSS3中的群组选择器,后代选择器[空格]子元素选择器＞相邻兄弟选择器+兄弟选择器~

群组选择器（','） / 表示既h1，又h2 / h1, h2 { color: red; } 后代选择器\[空格\]

╰半橙微兮°/ 2022年12月19日 08:52/ 0 赞/ 289 阅读

相关复合选择器——后代选择器，子选择器，并集选择器和伪类选择器

复合选择器复合选择器——后代选择器，子选择器，并集选择器和伪类选择器复合选择器是简历在基础选择器之上的，对基本选择器进行组合形成的。复合选择器可以更准确、更高效的选择目

╰+攻爆jí腚メ/ 2022年12月17日 04:27/ 0 赞/ 224 阅读

相关 css后代选择器:nth_CSS选择器：特异性

css后代选择器:nth ![cssmasterthumb][] The following is an extract from our book, [CSS Maste

青旅半醒/ 2022年12月03日 09:55/ 0 赞/ 263 阅读

相关 CSS选择器中后代选择器和派生选择器有什么区别？

根据W3C的说明：派生选择器通过依据元素在其位置的上下文关系来定义样式，你可以使标记更加简洁。在 CSS1 中，通过这种方式来应用规则的选择器被称为上

绝地灬酷狼/ 2022年06月10日 14:00/ 0 赞/ 273 阅读

相关子代选择器和后代选择器

在CSS3中，我们会遇到这个一个问题，当层级过多的时候，我们想对其中的某些标签进行操作，有时候我们又想只对某一层级的标签进行操作，这个时候就涉及到字标签和后代标签的问题

落日映苍穹つ/ 2022年05月18日 09:43/ 0 赞/ 272 阅读

相关 CSS的后代选择器和子代选择器的区别

1.后代选择器：写法：$(“ancestor descendant” ，标签之间用空格隔开例在的代码中写： <div> <p> <span>

桃扇骨/ 2022年03月14日 11:50/ 0 赞/ 281 阅读