Fatal编程技术网

Javascript 网套口罩

javascript jquery html css

Javascript 网套口罩,javascript,jquery,html,css,mask,Javascript,Jquery,Html,Css,Mask,我想让一幅画褪成白色。我使用了一个遮罩，得到了想要的效果，但问题是我想让图像覆盖整个页面（宽度我不关心高度），即使你调整窗口的大小。类似于背景大小：cover。但我不能这么做，因为你不能把面具放进背景里。如果我把100%的宽度放进html，它对屏幕来说就太大了。所以我想知道是否有办法解决这个问题，javascript或jquery之类的。谢谢 <html> <head> <title> Singapore - gallery </title> &

我想让一幅画褪成白色。我使用了一个遮罩，得到了想要的效果，但问题是我想让图像覆盖整个页面（宽度我不关心高度），即使你调整窗口的大小。类似于背景大小：cover。但我不能这么做，因为你不能把面具放进背景里。如果我把100%的宽度放进html，它对屏幕来说就太大了。所以我想知道是否有办法解决这个问题，javascript或jquery之类的。谢谢

<html>
<head>
<title> 
Singapore - gallery
</title>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<meta name="viewport" content="width=device-width, initial scale=1.0">
<style>
*  {

  margin: 0;
  padding: 0;

}
#background img {

  -webkit-mask-image: 
  -webkit-gradient(linear, left top, left bottom, 
        from(rgba(0,0,0,1)), 
        to(rgba(0,0,0,0)))
}
</style>
</head>
<body>
<div id="background"> <img src="gallery.jpg" /></div>
</body>


新加坡-画廊
*  {
保证金：0；
填充：0；
}
#背景img{
-webkit掩码图像：
-webkit渐变（线性、左上、左下、，
from（rgba（0,0,0,1）），
to（rgba（0,0,0,0）））
}
将宽度设置为100%对我来说很好。添加
宽度：100%至
#背景img


奇怪的是，我将宽度设置为：100%；在里面的面具之后。所以我想这就是问题所在。我不知道你为什么没有孩子；在梯度之后，这可能就是为什么如果你把它放在梯度之后，它就不起作用了。