css只有第一行代码有效

有时候，我们在CSS中写下了多行代码，但实际效果只有第一行代码有效。那么这是怎么回事呢？

p {
    font-size: 20px;
    color: blue;
    text-align: center;
}

上面这段CSS代码，我们期望所有的p标签都有20px的字号、蓝色的字体颜色和居中的文本对齐方式。

但实际情况下，只有第一行代码有效。

p {
    font-size: 20px;
}

这是为什么呢？其实原因很简单，是因为我们的CSS被后面的代码覆盖了。

比如说，如果我们在HTML文件中引入了另一个CSS文件，那么这个CSS文件中的样式会覆盖掉之前写的样式。而覆盖的原则是：后写的样式会覆盖掉先写的样式。

另外，如果我们在CSS中使用了“重要性”（important），那么这个样式也会覆盖掉之前写的样式。

p {
    font-size: 20px !important;
    color: blue;
    text-align: center;
}
    

在上面这个例子中，我们为字号加上了“！important”声明，这样就可以保证这个样式被优先应用。

总之，在使用CSS时，我们要多留意代码的顺序和是否有“！important”声明，这样就可以避免出现只有第一行代码有效的情况了。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！