【web初步】元素选择器

标签选择器

标签选择器也称为类型选择器,它直接引用HTML标签名称,用来匹配同名的所有标签。

  • 优点:使用简单,直接引用,不需要为标签添加属性。

  • 缺点:匹配的范围过大,精度不够。

  • 一般常用标签选择器重置各个标签的默认样式。

p{
	font-size:12px;
	color:red;
}

类选择器

类选择器以点号(.)为前缀,后面是一个类名。

在标签中定义class属性后,设置属性值为类选择器的名称。

可以给标签指定多个类名(各个类名中间用空格隔开),从而达到更多的选择目的

<style>
    .red{
        color:red;
    }
</style>
<body>
    <p class="red">
        aaaaa
    </p>
</body>

ID选择器

ID选择器以井号(#)为前缀,后面是一个ID名。

在标签中定义id属性后,设置属性值为ID选择器的名称。

元素的id值是唯一的,只能对应于文档中某一个具体的元素。

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

<body>

    <p id="red">
        aaaaa
    </p>

</body>

通配选择器

通配选择器使用星号(*)表示,用来匹配文档中的所有标签。

例如下面的代码,使用通配符选择器定义CSS样式,清除所有HTML标记的默认边距。

* {
  margin: 0;                    /* 定义外边距*/
  padding: 0;                   /* 定义内边距*/
}
发布了163 篇原创文章 · 获赞 18 · 访问量 7684

猜你喜欢

转载自blog.csdn.net/xcdq_aaa/article/details/105366008