# 选择器
[TOC]
## 通配符选择器
使用"\*"表示通配符，用来选择页面所有元素的样式。
```css
* {
padding:0px;
margin:0px;
}
```
## 元素选择器
元素选择器是最简单的选择器，用于选择指定元素名称的所有元素。
~~~html
HTML:<element></element>
CSS：element {...}
~~~
## id选择器
id属性规定HTML元素的唯一id。
id属性值的命名规范：
* 不能以数字开头
* 之后可以跟字母，数字，连字符，下划线等
* **大小写敏感**
>[danger] 需要注意的是id在HTML文档中具有唯一性，是**不可以重复**的。
id选择器中的样式会对具有指定id属性的HTML元素起作用。
HTML元素以id属性来设置id选择器,CSS中id选择器以"\#"来定义。
```html
HTML:<element id="idValue" ></element>
CSS：#idValue {...}
```
>[warning] CSS中id选择器**使用“#”+id值**，来定义样式。
## 类选择器
class定义元素的类名。
语法结构：`<element class="classname1 classname2 …"> `
classname：规定元素的类名称。如果需要为一个元素设定多个类，使用空格隔开。
命名规则：
* 不能以数字开头
* 其后字符：字母，数字，连字符（-），下划线（_）等
* 大小写敏感
类选择器指定的样式对指定class属性的元素起作用。
使用“.”标识一个类选择符，类名可以重复使用。
>[info]class选择器用于描述一组元素的样式，class选择器有别于id选择器，class可以在多个元素中使用。也可以在一个元素中使用多个
```html
HTML:<element class="classname1 classname2 …"></element>
CSS: .classname1 {...}
.classname2 {...}
```
>[warning] 在CSS中，类选择器以"**.**"+classname表示
## 包含选择器
包涵选择器用于指定处于某个选择器对应的内部元素。
```css
h1 em {color:red;}
```
## 子选择器
子选择器要求目标选择器必须作为外部选择器对应的元素的直接子元素。
>[danger]注意：子选择器与包含选择器的区别就在于是否是**直接**的父子关系，而不是爷爷与孙子这样的关系
```css
parent>child{width: 200px; height: 35px;}
```
## 群组选择器
群组选择器使用逗号对选择符进行分隔。
> 我们可以将逗号读成“和”。
```css
h1,p,myClass,#main{
font-size:20px;
}
```
