打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
css选择器
userphoto

2022.09.30 江西

关注

一、相邻兄弟选择器

  1. 就是选择紧跟在后面的一个兄弟元素

  2. 符号加号+

二、所有兄弟选择器

  1. 就是选择所有的兄弟元素

  2. 符号波浪号~

三、子代选择器

使用>表示子代选择器.比如div>p ,仅仅表示的式当前div元素选中的子代(不包含孙子...)元素p

四、后代选择器

使用空格表示后代选择器.(父元素的后代(包括儿子,孙子,重孙子))


<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style type="text/css">

            h1 + p{

                background-color: orange;

            }

            span ~ p{

                background-color: green;

                color: white;

                font: "courier new";

            }

        </style>

    </head>

    <body>

        <h1>我是一个h1标签</h1>

        <p>我是一个p标签</p>

        <p>我是一个p标签</p>

        <p>我是一个p标签</p>

        <p>我是一个p标签</p>

        <p>我是一个p标签</p>

        <p>我是一个p标签</p>

        <span>我是一个span</span>

        <p>我是一个p标签</p>

        <p>我是一个p标签</p>

        <p>我是一个p标签</p>

        <a href="http://www.baidu.com">百度</a>

        <p>我是一个p标签</p>

    </body>

</html>

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
CSS 了解一下
第9章 CSS3中的选择器-参考题
CSS选择器、优先级与匹配原理
详解CSS选择器、优先级与匹配原理
前端css选择器
css3有哪些选择器?
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服