HTML5-4(CSS选择器)

一.CSS有两大重点

• 1.属性

  通过属性的复杂叠加才能做出漂亮的网页

• 2.选择器

  通过选择器找到对应的标签设置样式,选择器的作用:选择对应的标签,为之添加样式

二.选择器的分类

• 1.标签选择器:根据标签名找到标签

标签选择器

• 2.类选择器

类选择器格式:** .+类名**

类选择器

• 3.id选择器:只能用给一个人(就像身份证一样,一一对应,HTML5是一门弱语言)

id选择器的格式: #id名

id选择器

• 4.并列选择器,满足一个条件就能更改样式,相当于iOS里面的 或 :||

并列选择器的格式:** div,p,.类名,#i名 都可以**

并列选择器

• 5.复合选择器 都满足才可以更改标签样式: 相当于iOS里面的 与: &&

复合选择器

• 6.后代选择器:儿子,孙子,重孙都无所谓

格式: **div p 或者 p div **等等 : 彼此之间是空格

后代选择器

注意:后代选择器是有顺序的

• 7.直接后代选择器:只有儿子才可以更改样式

格式: div 或者 p > div或者p 或者其他

直接后代选择器

• 8.相邻兄弟选择器

格式: 标签 + 相邻的标签 :符号用 + 号

相邻兄弟选择器

• 9.属性选择器

格式:标签名[属性名][属性名]:属性可以随便添加

属性选择器

• 10.伪类:主要是它的属性

格式:标签名:伪类属性名

伪类的属性

(1).伪类的属性foucus的使用

伪类的属性focus的使用

(2).伪类的属性hover的使用

伪类的属性hover的使用

• 11.伪元素

格式: 先找到再+ :伪元素

伪元素 伪元素first-letter的使用

最后:选择器的作用:找到对应的标签设置标签的样式