CSS无效的属性值？

Question

我不明白这有什么问题？我正在观看一个教程，它似乎在视频上正常工作，但是mozilla和chrome都忽略了这段代码并将其标记为无效的属性值。

.btn {
    background-color: #4FB69F url("img/texture.png") no-repeat right top;
} 

Answer 1

更改

background-color:

以

background:

因为background是

的快捷方式

• 背景颜色
• 背景图像
• 背景位置
• 背景重复
• 背景附件

Answer 2

另一个可能的原因可能是css属性或值中有一个“隐藏字符” 。

要解决此问题，请将代码直接从您的IDE复制到某个类似“ https://www.soscisurvey.de/tools/view-chars.php”的“隐藏字符”检测器，删除“坏”字符，然后再次保存代码，而不会出现坏字符。

奖金：如果您使用的是WebStorm等JetBrains ide，则此插件可以为您https://plugins.jetbrains.com/plugin/7448-zero-width-characters-locator

提供帮助

Answer 3

background-color: #4FB69F; 
background-image: url('images/texture.png'); 
background-repeat: no-repeat; 
background-position: right top;

在图片网址中，网址需要'而不是“ 背景位置与不重复分开 每个元素控件之间的;

Answer 4

不是直接解决方案，而是CSS属性值中的错字对我造成了类似的问题：

.PokeCard {
border: 2px solic mediumseagreen;
}

问题是打字错误 solic 而不是 solid 。

Answer 5

List

Answer 6

我遇到了类似的问题。

我尝试应用背景，但有一个错字。

我在 CSS 中的尝试

我遇到了这个错误

只需从值中删除双引号。因为 css 中的十六进制值不在双引号中。

Answer 7

而不是写：

.btn {
  background-color: #ffffff;
  background-image: url("img_tree.png");
  background-repeat: no-repeat;
  background-position: right top;
}

您可以使用速记属性背景：

.btn {
  background: #ffffff url("img_tree.png") no-repeat right top;
}

一个属性值是否丢失无关紧要，只要其他属性值按此顺序排列即可。 know more