小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
通配符选择器
- “*”表示的就是通配符,意思是:”所有的“。而在css中,可以使用
*代表所有的标签和元素,这时就它就叫做通配符选择器。 *会匹配所有元素,因此当你想要针对所有元素来设置的话可以用*来实现,如:设置所有元素的内外边距都为0
*{
margin:0px;
padding:0px
}
标签选择器
标签选择器就是直接使用html自带标签作为选择器,在本页面所有的同种标签,都会被标签选择器选择。比如:
p{
color:green;
}
a{
text-decoration:none;
}
p和a这两个选择器会选择当前页面所有的 <p> 标签和 <a> 标签,并为其设置同样的属性。
id选择器和类选择器
类选择器使用格式(以menu为类名例):
<style>
.menu{
属性
}
</style>
<body>
<div class="menu">
</div>
</body>
- 类名称要以字母或下划线开头,名称可以重复。
- 在一个标签中,也可以存在多个类名,如:
<标签名 class="类名1 类名2 类名3……">id选择器以#开头,后边是id名称,且id名称不可包含空格(类没有这个限制),id名称就是在标签中定义id属性,然后对应设置的属性值就是id名称。与类选择器类似。 举例:
<style>
#menu{
属性
}
</style>
<body>
<div id="menu">
</div>
</body>
id选择器优缺点:
优点就是,id使用的#选择器优先级高于类使用的.选择器,所以,当你想要提升优先级时,可以考虑使用id选择器。
缺点就是,在一个html文档中id选择器只能使用一次,而类可多次使用。
⚠️上述所说id选择器只能使用一次是指,一个html文档中同一id名称的id选择器只能出现一次,他不能像类选择器一样进行引用,只要id名称不同,随便创建几个都行。