CSS第一小节第二天

h1[id] { color: red; }CSS注释

注释不能嵌套注释

通配符选择器

通配符* 代表所有的标签。通过通配符选择器可以选择页面中的所有的标签。

通配符选择器用“*”号表示，他是所有选择器中作用范围最广的，能匹配页面中所有的元素.

通配符的穿透力很强，优先级高于继承的样式，会覆盖继承的样式。一般不用。

---

ID选择器

HTML标签中ID的属性值在一个页面中必须是唯一的。

ID选择器是可以帮助我们选择当前页面中唯一id值的标签，也就是根据标签的id属性值进行选取设置样式。ID选择器的的符号是#号,应用非常广泛

ID选择器的命名规范

1）只允许出现字母（大小写均可，严格区分） 、下划线、数字。

也就是说，id=”laoHe”和 id=”laohe”不冲突

2) 只允许以字母开头

3) 命名没有长度限制，可以是 1 个字母，也可以是很多个。不过不建议太长。

4) 不允许出现标签名（这是硬性规定，是有工作经验的表现

注意：

id选择器的优先级非常高，所以确定在整个页面内唯一出现时，才可以使用id选择器，不然因为优先级问题在后续维护中不能很好进行修改更新。

类选择器

类选择器就是选取页面中所有标签的class属性值相同的一类标签。

类选择器的符号是： .  (点)

标签可以包含多个类选择器，在class标签中用空格隔开

注意:不是类可以包含多个标签

1、相同的Class属性值，可以在HTML中出现多次。ID属性值在页面中只能出现一次。

2、一个class的属性可以有多个值，也就是说一个标签可以有多个类。

建议大家尽量使用类选择器。

使用ID时候情况：当确实能唯一确定当前页面中标签只会出现一次，这时候可以使用ID选择器。

如果不能保证相同的作用的标签在页面中只出现一次，那么这时候就选择使用类选择器。

复合选择器

复合选择器是由两个或多个基础选择器，通过不同的方式组合而成的

标签指定式选择器（即....又....）同时符合多个条件才有效

标签指定式选择器又称交集选择器，由两个选择器构成，其中第一个为标记选择器，第二个为class选择器或id选择器，两个选择器之间不能有空格，如h3.special或p#one

标签指定式复合选择器，要求必须是标签开头然后其他选择器。

比如：h3.demo {} ,需要同时满足既是标签h3又拥有demo类才能被选择到。

注意：使用非常少，一般不用。要么直接用id选择器，要么直接用类选择器

---

后代选择器

用来选择元素或元素组的后代，其写法就是把外层标记写在前面，内层标记写在后面，中间用空格分隔。当标记发生嵌套时，内层标记就成为外层标记的后代。

后代不仅仅包括儿子，还包括子子孙孙。

注意：后代选择器可以从左向右理解。但是真正浏览器在执行的时候是从右向左进行执行过滤的

并集选择器

并集选择器是各个选择器通过逗号连接而成的，任何形式的选择器（包括标记选择器、class类选择器id选择器等），都可以作为并集选择器的一部分。如果某些选择器定义的样式完全相同，或部分相同，就可以利用并集选择器为它们定义相同的CSS样式

子代选择器，是让CSS选择器只能选择儿子辈的元素。

例如：h1 > strong {color:red;}     此处是大于号

解读为：选择器 h1 > strong 可以解释为“选择作为 h1 元素子元素的所有 strong 元素”。

尖括号和选择器之间可以有空格也可以没有，没有限制。

建议:选择器和尖括号间有空格。

 属性选择器

属性选择器就是根据html标签的属性进行过滤选择

h1[id] { color: red; }    注意:h1和中括号中间不能有空格

h1[id][class] { font-size: 17px; }