4.15

Posted 2021-02-16 witnesszxw

css继承。

继承是一种规则，它允许样式不仅应用于某个特定html标签元素，而且应用于其后代。比如下面代码：如某种颜色应用于p标签，这个颜色设置不仅应用p标签，还应用于p标签中的所有子元素文本，这里子元素为span标签。

继承特性：html文档以树形结构组织，各元素之间具有层次关系，具有层次关系的元素之间，内层元素将继承外层元素的样式，多个外层元素中定义的样式将叠加到内层元素中。

能够继承的属性：文本的相关属性（如color，font-size，font-family，font-style， font-weight）；列表的相关属性（如list-style，list-style-image）

css优先级：行内样式>id选择器>类型选择器>标签选择器，在选择器优先级相同时，采用就近原则。

当样式出现冲突时才会出现上列问题。

 

 

一个元素设置了不同的CSS样式代码，那么元素会启用哪一个CSS样式？标签的权值为1，类选择符的权值为10，ID选择符的权值最高为100。特权值越高，相应的内容就显示相应的颜色。

.选择器类型
css中，选择器是一种匹配模式，用于选择添加样式的目标对象，注：行内样式不需要选择器，内部和外联式需要选择器。
基本格式：选择器{属性：属性值}

（1）基本选择器：
a.类选择器：定义方法：.类的名称（自定义名称，不能以数字开头）；调用方法：class=“类的名称”；
b.id选择器：定义方法：#ID名称；调用方法：id=“id名称”；
注：id和类的区别，id必须是唯一的，类可以重复多次使用。
c.标签（元素）选择器：定义方法：标签名称；一般用于批量格式化样式。
注：只能使用html内置的标签，这些标签是由w3c规定。
d.通用（*号）选择器：通用选择器是功能最强大的选择器，它使用一个（*）号指定，它的作用是匹配html中所有标签元素。
真实项目中，先定义通用，再定义标签，然后定义类和id选择器。

（2）复合选择器：
a.（并列关系）：e1,e2,e3(并列关系，选择器之间共用同一个样式)
作用：将同样的的样式用于多个选择器，可以将选择符以逗号分隔的方式为组。对公共的的部分分隔。
b.（父子关系）：e1>e2(不能隔代)
c.（后代关系）：e1空格e2（可以隔代）             注：>作用于元素的第一代后代，空格作用于元素的所有后代
d.（相邻关系）：e1+e2（仅仅只选择下一个符合条件的相邻元素）
e.（兄弟关系）：e1~e2（选择e1元素后面的所有兄弟元素）

（3）属性选择器：
a.：e1[attr]，选择具有attr的属性的e1
b.：e1[attr=value],选择具有attr属性，并且值为value的e1.

（4）伪类选择器：

a:hover{color:red;}