CSS具有3大选择器:id选择器优先级,类选择器优先级,标签选择器优先级,有关它们的优先级及相关实验,请看我的另一篇文章《CSS选择器优先级》。
标签选择器
1
顾名思义,标签选择器就是直接把标签的名字当做选择器。
2
常用的标签选择符如下:
3
使用的时候,直接写标签名称就行,比如body。当设置了某个标签的样式时,这个设置会对本页面所有的相同标签起作用。
ID选择器
1
ID代表了唯一,就像身份证号一样,每一个人的都不相同。页面元素的ID也不能相同,一个ID在html中只能出现一次。
2
设置标签的id,相当于把id和值当做一对属性值,比如
段落1
,这就设置了段落标签p的id为p1。3
Id选择符,直接使用 #id,把id替换为对应标签的id值,就可以精确的选择某个标签。比如选择刚才的p标签:#p1 。
4
注意:(1) 一个Html网页中id只能出现一次;(2) id是区分大小写的,#p1和#P1代表的是不同的id选择器,选择的元素不同;(3) id选择器是最精准的选择器,可以定位到某个具体的唯一元素。
Class类选择器
1
Class类选择器,代表了某一类相同的样式,“物以类聚,人以群分“,比如可以把红色字体定义为一类,所有需要设置红色字体的标签都加上这个类。
2
给标签添加类,实际也是把类和类值当做一对属性值添加到标签中,比如
段落1
,这就设置了这个段落的class为red。3
class类选择器,直接使用 .class,把class替换为对应的类值。这样就可以为具有相同类的标签应用相同的样式了。比如: .red { color : red; } 这设置了类red的标签字体颜色为红色。
4
注意:(1) 多个标签可以使用相同的类,相当于给它们设置了相同的样式,比如:
标题1
段落1
这样可以把h1和p都设置为红色字体。 (2) 一个标签可以设置多个类,相同于讲一个标签设置了多种样式,比如:段落1,红色,加粗
定义粗体为一类样式 .bold { font-weight : bold; } font-weight意思是字体重要性,bold就是加粗的意思。这样段落p会同时具有类red和类bold的样式。注意:多个类名中间使用空格间隔。