CSS-选择器4-后代选择器

CSS选择器-系列文章

1、后代选择器

div p选择div内部出现的所有p元素,不管p元素嵌套的多少层。

2、效果演示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>后代选择器</title>
    <style type="text/css">
        #id1 p{
            color: red;
        }
    </style>
</head>
<body>
    <div id="id1">
        <div id="id2">
            <div id="id3"></div>
            <p>内部p元素</p>
        </div>
        <p>外部p元素</p>
        <p>外部p2元素</p>
    </div>
</body>
</html>

运行效果:

image.png

CSS选择器-系列文章
下一节 选择器5-子元素选择器

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,696评论 1 92
  • 本文主要是起笔记的作用,内容来自慕课网. 认识CSS样式 CSS全称为“层叠样式表 (Cascading Styl...
    0o冻僵的企鹅o0阅读 7,532评论 0 30
  • 1.认识CSS样式CSS全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义H...
    静默丶阅读 11,090评论 30 95
  • 本课来自http://www.imooc.com/learn/9请不要用作商业用途。 HTML5 HTML介绍 H...
    PYLON阅读 8,617评论 0 5
  • 你的视角是怎么样,世界就是怎么样;你的世界是怎么样,你就会成为什么样。 今天心情好,看身边所有的事物都是美好的,会...
    以内斯阅读 1,805评论 1 3

友情链接更多精彩内容