1.CSS选择器是什么
CSS 选择器规定了 CSS 规则会被应用到哪些元素上。要想将CSS样式应用于特定的HTML元素,首先需要找到该目标元素。在CSS中,执行这一任务的样式规则部分被称为选择器。
2.选择器有哪些
标签选择器
标签选择器(也叫元素选择器)是指用HTML标签名称作为选择器,按标签名称分类,为页面中某一类标签或元素指定统一的CSS样式。其基本语法格式如下:
div{color:red; 属性2:属性值2; 属性3:属性值3; }
如上就表示可以把div标签全部选择出来,并设置统一样式,color:red。
标签选择器最大的优点是能快速为页面中同类型的标签统一样式,同时这也是他的缺点,不能设计差异化样式。
类选择器
按照给定的 class 属性的值,选择所有匹配的元素。类选择器使用“.”(英文点号)进行标识,后面紧跟类名,其基本语法格式如下:
.classname(类名){属性1:属性值1; 属性2:属性值2; 属性3:属性值3; }
标签调用的时候用 class=“classname(类名)” 即可。
类选择器最大的优势是可以为元素对象定义单独或相同的样式,可以选择一个或者多个标签
id选择器
按照 id 属性选择一个与之匹配的元素。需要注意的是,一个文档中,每个 ID 属性都应当是唯一的。
id选择器使用#进行标识,后面紧跟id名,其基本语法格式如下:
#idname{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; }
用法基本和类选择器相同。
id选择器和类选择器的区别:
id选择器和类选择器最大的不同在于 使用次数上。
W3C标准规定,在同一个页面内,不允许有相同名字的id对象出现,但是允许相同名字的class。
通用选择器
选择所有元素。(可选)可以将其限制为特定的名称空间或所有名称空间。
通配符选择器用 * 号表示,这是所有选择器中作用范围最广的,能匹配所有的元素,其基本语法格式如下:
* { 属性1:属性值1; 属性2:属性值2; 属性3:属性值3; }
例如下面的代码,使用通配符选择器定义CSS样式,清除所有HTML标记的默认边距。
* {
margin: 0; /* 定义外边距*/
padding: 0; /* 定义内边距*/
}
通配符选择器一般用于统一消除默认样式,比如
margin和padding和ul li标签前面的圆点