如何使身体的背景颜色变为黑色和白色

时间:2016-07-06 16:38:20

标签: css

我想改变身体的颜色,我想让它变成黑色和白色。这是我目前使用的代码:

font-family: Montserrat, sans-serif;
    background-image: url("http://vlr.tynt.com/?format=txt&key=284d869ffe43382ebe88a02cabb697ab&u=http%3A%2F%2Ft.wallpaperweb.org%2Fwallpaper%2Fnature%2F1920x1080%2FPacific_Sunset_Pismo_Beach_California.jpg&subId=cyfIqK8eur4kvOacwqm_6r&txt=&loc=http%3A%2F%2Fwallpaperweb.org%2Fwallpaper%2Fnature%2Fpacific-sunset-pismo-beach-california_40871.htm&ref=https%3A%2F%2Fwww.google.al%2F&title=Nature%3A%20Pacific%20Sunset%2C%20Pismo%20Beach%2C%20California%2C%20desktop%20wallpaper%20nr.%2040871");
    color: white;
    filter: grayscale(100%);
    -webkit-filter: grayscale(90%);

我已经google了很多,但网站向我显示的图像就像是身体中的随机图像而不是背景图像

1 个答案:

答案 0 :(得分:0)

您无法在body背景上使用过滤器,但是使用:before伪选择器这样做是一种愚蠢的方法,如下所示:



body {
  font-family: Montserrat, sans-serif;
  color: white;
  margin:0;
  padding:0;
}
  body:before {
    content: "";
    background: url("http://vlr.tynt.com/?format=txt&key=284d869ffe43382ebe88a02cabb697ab&u=http%3A%2F%2Ft.wallpaperweb.org%2Fwallpaper%2Fnature%2F1920x1080%2FPacific_Sunset_Pismo_Beach_California.jpg&subId=cyfIqK8eur4kvOacwqm_6r&txt=&loc=http%3A%2F%2Fwallpaperweb.org%2Fwallpaper%2Fnature%2Fpacific-sunset-pismo-beach-california_40871.htm&ref=https%3A%2F%2Fwww.google.al%2F&title=Nature%3A%20Pacific%20Sunset%2C%20Pismo%20Beach%2C%20California%2C%20desktop%20wallpaper%20nr.%2040871");
    background-size: cover;
    position: absolute;
    height:100%;
    width:100%;
    z-index: -1;
    filter: grayscale(100%);
    -webkit-filter: grayscale(90%);
  }




请注意,此解决方案不支持IE或Edge。

另一个解决方案是创建一个应用过滤器的元素,并使用绝对定位将其放在内容之后。

Source