在浏览器中打开前面写的例子页面,你会发现 <strong>
元素中的文字会比其他文字粗一些。这些样式就是在浏览器定义的默认HTML样式。
而<strong>
元素是红色的,这是你在自己的样式表中定义的样式。
同时,<strong>
作为 <p>
的子元素,也继承了 <p>
的样式。同样的, <p>
也从 <body>
中继承了许多的样式。
再来看看优先级,从高到低依次为:网页开发者定义的样式、网页阅读者定义的样式、浏览器的默认样式。
对继承的元素来说,子元素自身的样式优先级高于从父级继承来的样式。
当然,关于优先级还有更多的知识点,我们会在后面的章节中继续介绍。
用户自定义样式
CSS 另外提供了一个!important关键字,用户可以通过使用这个关键字使自己定义的样式覆盖掉开发者定义的样式。
这就意味着,作为开发者,你很难准确的预知页面最终在用户电脑上的显示效果。
如果你想了解关于层级和继承的全部细节,请阅读CSS文档中的相关章节(英文):Assigning property values, Cascading, and Inheritance。建议谷歌浏览器自带翻译!