html 选择器

选择器

要想将CSS样式应用于特定的HTML元素，首先需要找到该目标元素。在CSS中，执行这一任务的样式规则部分被称为选择器（选择符）。

选择器类型：

1.id选择器（#myid）

2.类选择器（.myclassname）

3.标签选择器（div,h1,p）

4.相邻选择器（h1+p）

5.子选择器（ul > li）

6.后代选择器（li a）

7.通配符选择器（*）

8.属性选择器（a[rel=“external”]）

9.伪类选择器（a:hover, li:nth-child）

---

选择器的优先级是怎么规定的呢？

一般而言，选择器越特殊，它的优先级越高。也就是选择器指向的越准确，它的优先级就越高。通常我们用1表示标签名选择器的优先级，用10表示类选择器的优先级，用100标示ID选择器的优先级。比如上例当中 .polaris span {color:red;}的选择器优先级是 10 + 1 也就是11；而 .polaris 的优先级是10；浏览器自然会显示红色的字。

标签选择器（元素选择器）

标签选择器是指用HTML标签名称作为选择器，按标签名称分类，为页面中某一类标签指定统一的CSS样式。

标签名{属性名1:属性值1; 属性名2:属性值2}

优点是快速为页面中同类型的标签同一样式，同时这也是他的缺点，不能设计差异化样式

类选择器

类选择器用" . "进行标识，后面紧跟类名，基本语法

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

类选择器最大的优势为元素设计差异化样式

1.长名称或词组就用   中横线  连接			nav-a
2.不建议使用下划线命名选择器
	1.多打一个shift
	2.浏览器兼容问题，用_tips命名选择器，再ie6是无效的
	3.能良好区分js变量命名   user_password  js和java命名变量的规范
3.不要用纯数字或者中文命名

多类名选择器

可以给标签指定多个类名，从而达到更多选择的目的

1.样式的显示效果和类名的先后顺序没有关系，css样式书写的顺序有关系
	层叠的概念，也就是说样式会被后来样式覆盖掉
2.类名之间用空格隔开

多类名选择器还是非常重要的，他在些项目的时候经常用到

id选择器

id选择器用" # "进行标识，后面紧跟id名，基本语法

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

id名就是HTML元素的id属性值，大多数HTML元素都可以定义id属性，元素的id值是唯一的，只能对应文档中的某一 个具体的元素

用法和类选择器类似

id选择器和类选择器区别

id选择器相当于身份证(唯一的) 不能重复，只能使用1次

类选择器相当于名字(也能区分，但不唯一) 可重复，可多次使用

最大区别就是使用次数上

通配符选择器

用"*"表示，所有选择器中作用范围最广的，能匹配所有的元素

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

权重非常低

伪类选择器

伪类选择器向某些选择器中添加特殊的效果，可以选择第一个元素，选择第N个元素

类选择器用. 伪类选择器用:

链接伪类选择器

• link 未访问的连接
• visited 已访问的连接
• hover 鼠标悬停
• active 选定的链接

写的时候，顺序不要颠倒，lvha，love hate 爱恨记忆法