css常用选择器
CSS选择器的作用是从HTML页面中找出特定的某类元素,而常用的CSS选择器有如下几类,我们一起来看看吧!
一. 通配符选择器
通配符选择器常用' * '号表示,他是所有选择器里作用范围最广的,能匹配页面中所有的元素。
基本语法格式: *{属性:属性值;}
例子
使用该选择器定义样式,清除所有HTML标记的默认边距。
*{
margin:0; /* 定义外边距 */
padding:0; /* 定义内边距 */
}
但是在实际开发中不建议使用通配符选择器,因为它设置的样式对所有的HTML标记都生效,不管标记是否需要该样式,反而降低了代码的执行速度。
二. 标签选择器
标签选择器是指用HTML标记名称作为选择器,按标记名称分类,为页面中某一类标签指定统一的CSS样式。
基本语法格式: 标签名{ 属性:属性值;}
所有的HTML标记名都可以作为标签选择器,例如:div, a, p, h1,span, 等等。用标签选择器定义的样式对页面中该类型的所有标签都有效。
例子
使用span选择器定义HTML页面中所有段落的样式。
span{
font-size:20px;
color:#222;
font-family:"仿宋";
}
标签选择器最大的优势是能快速为页面中同类型的标签统一样式,同时这也是他的缺点,不能设计差异化样式。
三. 类选择器
类选择器使用‘ . ’(英文点号)进行标识,后面紧跟类名。
基本语法格式: .类名{ 属性:属性值;}
该语法中,类名为HTML元素的class属性值,大多数HTML元素都可以定义class属性。
例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=