css的三种方法及优先级（HTMLCSS掌握css的继承以及代码的优先级问题）
css的三种方法及优先级（HTMLCSS掌握css的继承以及代码的优先级问题）标签（div、p、span等）的权值为1，类选择符（.xxx）的权值为10，ID选择符（#xxx）的权值为100，内联样式（style="color:#f00;"）的权值为1000。下面是权值的规则：经过我们总结测试，可以得出以下结论：css就像工程师一样是很严谨的，有的时候我们为同一个元素设置了不同的CSS样式代码，那么元素会启用哪一个CSS样式呢?我们来看一下面的代码：上边的代码中，p和.first都匹配到了p这个标签上，那么会显示哪种颜色呢？#0f0是正确的颜色，那么为什么呢？是因为浏览器是根据权值来判断使用哪种css样式的，权值高的就使用哪种css样式。
上边文章我们说了使用css的三种不同的选择器，本篇文章我们主要介绍css的继承规则以及css代码的权重优先级问题。
（1）css的继承规则CSS的某些样式代码是具有继承性的，那么究竟什么是继承呢？继承是一种规则，它允许样式不仅应用于某个特定html标签元素，而且应用于其后代。比如下面代码：我们设置p标签的字体颜色为红色并添加1像素的红色边框。
在网页中的显示效果就如下图所示：
从上边的图片你可以看出字体颜色为红色不仅使p标签中的文字变成了红色，还应用于p标签中的所有子元素文本，这里子元素为span标签。但是边框属性并没有应用到子元素中去。
经过我们总结测试，可以得出以下结论：
- 关于文字样式的属性，都具有继承性。这些属性包括：color、 text-开头的、line-开头的、font-开头的。
- 关于盒子、定位、布局的属性，都不能继承。
css就像工程师一样是很严谨的，有的时候我们为同一个元素设置了不同的CSS样式代码，那么元素会启用哪一个CSS样式呢?我们来看一下面的代码：
上边的代码中，p和.first都匹配到了p这个标签上，那么会显示哪种颜色呢？#0f0是正确的颜色，那么为什么呢？是因为浏览器是根据权值来判断使用哪种css样式的，权值高的就使用哪种css样式。
下面是权值的规则：
标签（div、p、span等）的权值为1，类选择符（.xxx）的权值为10，ID选择符（#xxx）的权值为100，内联样式（style="color:#f00;"）的权值为1000。
我们来做一个权重的拔高练习，观察以下代码看一下p标签以及span标签内的文字显示颜色应该是什么？
由上边我们可以看出来，p标签的样式中#second的权值最高为100，那么p的文字颜色为yellow，而span标签样式中内联样式权值最高为1000，那么span的文字颜色就为#000。我们的结果就会如下图所示：
对于css的继承以及代码优先级的问题我们今天就先介绍到这里，大家在平时可以自己多加练习练习，自己多写几个权重的例子尝试尝试。
每日金句：人若有志，就不会在半坡停止。喜欢我的文章的小伙伴记得关注一下哦，每天将为你更新最新知识。
