[分享]css中字体颜色不起作用

在CSS样式表中，我们可以使用color属性改变文本的颜色。但是，有时候我们会遇到CSS中字体颜色不起作用的问题。p{ color: red; } 为什么我们设置了color属性，但是文本颜色却没有改...

在CSS样式表中，我们可以使用color属性改变文本的颜色。但是，有时候我们会遇到CSS中字体颜色不起作用的问题。

p{
  color: red;
} 

为什么我们设置了color属性，但是文本颜色却没有改变呢？

可能存在以下几种原因：

1. 优先级被其他样式所覆盖
2. 选择器没有匹配到元素
3. 属性值书写错误

1.优先级被其他样式所覆盖

CSS中存在优先级的问题，有些样式可能会被其他样式所覆盖。例如我们在全局样式中设置默认文本颜色为黑色，但是在某个样式中也设置了文本颜色，此时该样式会优先生效，而不是全局样式。

body{
  color: black;
}
p{
  color: red;
} 

2.选择器没有匹配到元素

如果选择器没有匹配到元素，那么这个样式也不会生效。例如，我们可能会写出一个选择器来匹配一个不存在的元素。

span{
  color: red;
} 

3.属性值书写错误

这是一个非常常见的错误，有时候我们可能会错把属性值写错，或者书写格式不正确。

p{
  colors: red;
} 

以上是CSS中字体颜色不起作用的可能原因，我们可以通过查看浏览器控制台或者使用检查元素来调试样式。如果存在冲突或者错误，我们可以对样式进行修改或优化，以达到所需效果。