CSS基础选择器（二）

最新推荐文章于 2025-10-19 23:24:12 发布

原创最新推荐文章于 2025-10-19 23:24:12 发布 · 675 阅读

本内容遵循CC 4.0 BY-SA版权协议

收录于

CSS学习笔记

在css中id选择器用"#"+“名称"来定义，这一点上和前面的类选择器的”."+"名称"很像。

    <style>
        #green {
            color: green;
        }
    </style>

id选择器用id="名称"来调用，这一点和前面的类选择器的调用方式也很像。

    <div id="green">第一次调用</div>

运行结果如下：

在这里插入图片描述

从上面的介绍来看，id选择器和前面的类选择器好像差不多，就是换了定义和调用方式一样。但是这二者是有本质去别的，id选择器只允许被调用一次，但是类选择器可以被多个标签多次调用。

id的意思是身份证件，我们都知道一个人只能有一个身份证，所以id选择器肯定也就只允许被调用一次。

在css中，通配符选择器用"*****"来定义

    <style>
        * {
            color: blue;
        }
    </style>

通配符选择器不需要调用。

<body>
    <p>这是一个段落</p>
    <div>这是一个盒子</div>
    <ul>
        <li>这是一个无序列表</li>
    </ul>
</body>

它的作用是把所有标签的样式都规定成一个样式，运行结果如下：

在这里插入图片描述

通配符选择器是不需要调用的，当一个标签没有调用任何一个选择器的时候，默认调用通配符选择器。

把刚才的代码进行一个修改：

    <style>
        * {
            color: blue;
        }
        .green {
            color: green;
        }
    </style>

然后调用：

<body>
    <p>这是一个段落</p>
    <div>这是一个盒子</div>
    <ul>
        <li class="green">这是一个无序列表</li>
    </ul>
</body>

运行结果：

在这里插入图片描述

标签

#css #html #前端