2-基础选择器

一、标记选择器

• 标记选择器是指用HTML标记名称作为选择器，
• 作用：根据指定的标签名称, 在当前界面中找到所有该名称的标签, 然后设置属性
• 基本语法格式如下：

标记名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; }

例如： p{ font-size:12px; color:#666; font-family:“微软雅黑”;}
上述CSS样式代码用于设置HTML页面中所有的段落文本——字体大小为12像素、颜色为#666、字体为“微软雅黑”

二、类选择器

• 类选择器使用“.”（英文点号）进行标识，后面紧跟类名
• 作用: 根据指定的类名称找到对应的标签, 然后设置属性
• 基本语法格式如下：

.类名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; }

• 该语法中，类名即为HTML元素的class属性值，大多数HTML元素都可以定义class属性。类选择器最大的优势是可以为元素对象定义单独或相同的样式。

例如： .pcolor{color:#ff0000;font-size:14px;}
用于设置class=“pcolor”的标签元素的样式为-----字体颜色为红色，大小为14px

注意:

• 每个HTML标签都有一个属性叫做class, 也就是说每个标签都可以设置类名
• 在同一个界面中class的名称是可以重复的
• 在编写class选择器时一定要在class名称前面加上点
• 类名的命名规范和id名称的命名规范一样
• 类名就是专门用来给CSS设置样式的
• 在HTML中每个标签可以同时绑定多个类名

三、id选择器

• id选择器使用“#”进行标识，后面紧跟id名
• 作用：根据指定的id名称找到对应的标签, 然后设置属性
• 基本语法格式如下：

#id名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; }

例如
#menubar{margin:0;background:#ccc;}
用于设置id=“menubar”的元素的样式为------------外边距为0，背景颜色为#ccc；

注意:

• 每个HTML标签都有一个属性叫做id, 也就是说每个标签都可以设置id
• 在同一个界面中id的名称是不可以重复的
• 在编写id选择器时一定要在id名称前面加上#
• id的名称是有一定的规范的， id的名称只能由字母/数字/下划线(a-z 0-9 _)
• id名称不能以数字开头 id名称不能是HTML标签的名称()不能是a h1 img input …)
• 在企业开发中一般情况下如果仅仅是为了设置样式, 我们不会使用id ,因为在前端开发中id一般留给js使用的

四、通配符选择器

• 通配符选择器用“*”号表示，它是所有选择器中作用范围最广的，能匹配页面中所有的元素。
• 作用：为整个页面设置样式
• 基本语法格式如下：

*{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; }

• 该语法中*可以匹配页面中所有的元素。

例如：
* {
	margin: 0;                    /* 定义外边距*/
	padding: 0;                  /* 定义内边距*/
}
使用通配符选择器定义CSS样式，清除所有HTML标记的默认边距。