[分享]css内嵌样式不显示的原因

在网页制作过程中，我们经常使用内嵌样式来定义元素的样式，但有时候我们会发现，设定的样式并没有生效，这可能是由于以下原因： p { color: red; } 一、标签书写错误：当标签书写错误时，比如少...

在网页制作过程中，我们经常使用内嵌样式来定义元素的样式，但有时候我们会发现，设定的样式并没有生效，这可能是由于以下原因：

<style>
    p {
        color: red;
    }
</style> 

一、标签书写错误：

当标签书写错误时，比如少了一个尖括号或者标签名写错了，就会导致样式无法应用到元素上。

<style>
    p {
        color: red;
    }
</styl> 

上述代码缺少了尾部的“e”，导致样式不生效。

二、选择器书写错误：

有时候我们会把选择器书写错误，比如使用了不存在的选择器、没有选择到目标元素或者是选择到了错误的元素。

<style>
    h1 {
        color: red;
    }
</style>
<p>这是一个段落</p> 

上述代码使用了“h1”标签名作为选择器，但是实际上我们需要选择“p”标签，因此样式不生效。

三、样式书写错误：

在使用内嵌样式时，如果我们书写的样式属性错误，或者是属性值书写错误，都会导致样式无法应用到元素上。

<style>
    p {
        color: red;
        background: yeowlow;
    }
</style> 

上述代码中，“background”属性值书写错误，应该为“yellow”，导致样式不生效。

总之，当我们使用内嵌样式时，需要认真检查代码，确保标签、选择器和样式都书写正确，才能保证样式生效。