一.什么是选择器?
每一条CSS样式声明(定义)由两部分组成,形成如下:
选择器{样式;}
在{}之前的部分就是"选择器","选择器"指明了{}中的"样式"的作用对象,也就是“样式”作用于网页中的哪些元素.
二.标签选择器
标签选择器其实就是html代码中的标签。如<html>,<body>,<p>,<img>等
三.类选择器
类选择器在CSS样式编码中是最常用到的。
P:1.英文原点开头 2.其中类选择器可以任意起名
语法: .类选择器名称{CSS样式代码};
四.ID选择器
在很多方面,ID选择器都类似于类选择符,但也有一些重要的区别:
1.为标签设置id= "ID名称",而不是class= "类名称".
2.ID选择符的前面是#号,而不是英文原点"."。
ID选择器和类选择器的区别.
相同点: 可以应用于任何元素
不同点:
1.ID选择器只能在文档中使用一次。在一个HTML文档中,ID选择器只能使用一次,而且仅一次,而类选择器可以使用多次.
2.可以使用类选择器词列表方法为一个元素同时设置多个样式。我们可以为一个元素同时设多个样式,但只可以使用类选择器的方法实现,ID选择器是不可以的.(个人理解.ID选择器就像是一张身份证,你领了之后,其他人就不能再领,有且只有一个~)
五.子选择器
子选择器用于选择指定标签元素的第一代子元素。
通俗理解:就是指,为这一类的子类,仅子类添加指定样式.
语法举例:.food>milk{border:1px solid red};�
六.包含(后代)选择器
包含选择器,即加入空格,用于选择指定标签元素下的后背元素.
语法举例:.food span{color:red};这行代码会使food下所有span标签的字体都变成红色
后代选择器和子选择器的却别:
1.自选择器仅是指它的直接后代.后代选择器作用于它所有后代
2.后代选择器通过空格来进行选择,子选择器通过">"进行选择
七.通用选择器
通用选择器是功能最强大的选择器,它使用一个(*)号指定,它的作用是匹配html中所有的元素.
八.伪类选择符
伪类选择符允许给html不存在的标签(标签的某种状态)设置样式。
语法举例:a:hove{color:red};
关于伪选择符:到目前为止,可以兼容所有浏览器的"伪类选择符"就是a标签上使用:hover.其实:hover可以放在任意的标签上,比如说 p:hover.但是它们的兼容性也是很不好的.
九.分组选择符
为html中多个标签元素设置同一个样式,可以使用分组选择符(,)。
语法举例:h1,span{color:red};相当于 h1{color:red;} span{color:red;}