实例演示html元素的样式来源与优先级(有图示)

元素的样式与优先级

一.行内样式>文档样式>外部样式>默认样式。

行类样式的三大通用属性是id,class,style

1.默认样式继承标签默认样式

h1 {
    display: block;
    font-size: 2em;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

2.外部样式引用css样式

h1 {
    color: rgb(41, 191, 96);
}

3.文档样式在html文档里面style标签修改自定义样式的元素。

h1 {
    color: red;
    font-weight: normal;
}

4.行类样式

<h1 style="color: red">hello world</h1>

5.上效果图

![效果图]（https://github.com/yydoos/22/blob/main/0117/%E5%B1%8F%E5%B9%95%E6%88%AA%E5%9B%BE%202023-01-18%20151941.png?raw=true）