我的drop-shadow过滤器语法不正确吗? [重复]

问题描述 投票:0回答:2

这个问题在这里已有答案:

阴影过滤器被忽略。

我是初学者,所以也许我的语法不对?正确应用了灰度,所以我知道我正确地处理了图像。

img#mportrait{
  -webkit-filter: drop-shadow(15px 0px 5px rgba(51, 51, 51, 0.9));
  filter: drop-shadow(15px 0px 5px rgba(51, 51, 51, 0.9));
  filter: grayscale(0.7);
}

页面检查的结果:https://imgur.com/a/kONGtC3

css google-chrome
2个回答
0
投票

每个连续的过滤规则都会覆盖最后一个。所以你想要做的是将规则与之间的空格结合起来,在规则的前缀和非前缀版本中重复grayscale()

img#mportrait{
  -webkit-filter: drop-shadow(15px 0px 5px rgba(51, 51, 51, 0.9)) grayscale(0.7);
  filter: drop-shadow(15px 0px 5px rgba(51, 51, 51, 0.9)) grayscale(0.7);
}

grayscale()仅适用于您的示例,因为在取消前面的规则后,它是唯一应用的规则。


-2
投票

阴影是它自己的属性,它是box-shadow: ____。所以你的代码是:

img#mportrait{
  -webkit-filter: drop-shadow(15px 0px 5px rgba(51, 51, 51, 0.9));
  box-shadow: 15px 0px 5px rgba(51, 51, 51, 0.9);
  filter: grayscale(0.7);
}

这是来自this MDN articlethis W3Schools article。 希望能帮助到你。

© www.soinside.com 2019 - 2024. All rights reserved.