图像代替颜色

Question

我在CSS中有一个可移动的背景图像，但是随后我发现此代码根据实现的百分比更改颜色。所以我的计划是使用图像以不同的色调根据百分比进行更改，但是它是在Java中使用的，而我对Java的使用经验不是很丰富。因此，我尝试插入URL而不是十六进制，但是它变成了白色，并且我厌倦了使用body.style.backgroundImage，但是除了填充区域之外的所有东西都得到了背景图像。

  if(fillperc * 100 >= 19) { var barColor = '#f74723'};
  if(fillperc >= 20 && fillperc <= 39) { var barColor = '#f7ad2c'};
  if(fillperc >= 40 && fillperc <= 59) { var barColor = '#f8e356'};
  if(fillperc >= 60 && fillperc <= 79) { var barColor = '#22c179'};
  if(fillperc >= 80 && fillperc <= 90) { var barColor = '#1c7d5d'};
  if(fillperc >= 91 && fillperc <= 101) { var barColor = '#22463f'};

  background: url(https://i.imgur.com/eOQWiqi.png) no-repeat center center;
	background-repeat: repeat;
  animation: shimmer 25s linear infinite;
}


@keyframes shimmer {
	0% { background-position: 0 0; }
  100% { background-position: 512px 0; }
}

Answer 1

您需要在URL周围加上引号，例如：

background: url("https://i.imgur.com/eOQWiqi.png") no-repeat center center;