Question

我正在使用Fliter:blure在我的网站中制作图像和文字模糊。它在IE中运行不正常，所以我添加了Filter"progid:DXImageTransform.Microsoft.Blur(pixelradius=3)以使其正常工作。此样式适用于页面上添加的图像和文本，但不会使背景图像模糊。

有没有人知道如何在IE8 / 9中使背景图像模糊？

Answer 1

这是最全面的做法;将其添加到 CSS 中，然后尝试将类模糊添加到所需的div：

.blur {
  filter: blur(5px);
  /* Someday, sigh ... */

  -webkit-filter: blur(5px);
  /* Prefixed CSS3 blur filters */

  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  filter: url(#blur);
  /* Firefox needs SVG */

  filter: progid: DXImageTransform.Microsoft.Blur(PixelRadius='5');
  /* IE lte 9 */

  background-image: url(http://f.cl.ly/items/1J0T0L3q1h1a0c3Q0W0I/meatloaf.jpg);
  background-repeat: repeat;
  /* Repeat for browsers that don't support background-size */

  background-position: top center;
  background-size: cover;
  display: block;
  width: 100%;
}

我希望它有所帮助...

IE8，IE9 - 如何使背景图像模糊

1 个答案: