样式表的来源与优先级的实例演示
样式表的来源与优先级
来源1:代理样式/浏览器样式/默认样式(继承自HTML)
例如:<h2>PHP中文网</h2>
来源2:自定义样式
自定义样式1:行内样式,style属性
~<h1 style="color: blue;">PHP中文网</h1>~
自定义样式2:文档样式/内部样式,style标签
<h1>晚上好</h1><h1>吃了吗</h1><h1>xxx</h1><style>h1{color: blue;}</style>
自定义样式3:外部样式,css文档
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>自定义样式来源与优先级</title><style>@import url('static/style.css');</style></head>
优先级1:自定义样式会覆盖默认样式
例如:<h2 style="color: red;">PHP中文网</h2>
优先级2:书写顺序,写在后面的同名属性会覆盖前面的(优先级相同情况下)
<div style="color: blue;"><h1 style="color: red;">php.cn</h1></div>