Question

我正在创建一个网页，我想在我的身体背景图像属性中应用模糊滤镜，为此，我需要引用background-image属性，这可能吗？

Answer 1

您必须使用两个不同的div，一个用于背景图像，另一个用于您要插入的数据。

请参阅下面的示例，其中我创建了两个div -

装置技术领域
。数据

它们都与position: fixed和left: 0; right: 0;一起放置。显示它们的区别来自z-index值，这些值已为元素设置不同。

<强> HTML

<div class="background-image"></div>
<div class="content">
    <p>Hello World</p>
    <p>New Paragraph</p>
</div>

<强> CSS

.background-image {
  position: fixed;
  left: 0;
  right: 0;
  z-index: 1;

  display: block;
  background-image: url('https://www.google.co.in/logos/doodles/2015/mf-husains-100th-birthday-5102553322749952.2-hp.jpg');
  width: 1200px;
  height: 800px;

  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  filter: blur(5px);
}

.content {
  position: fixed;
  left: 0;
  right: 0;
  z-index: 9999;
  margin-left: 20px;
  margin-right: 20px;
}

如何参考背景图片？

1 个答案: