Html 引导3上的模糊背景图像

我刚刚开始开发我的第一个引导式设计，但我正在努力创造一个模糊的背景图像

这是我的密码：

身体{ 填充顶部：40px； 填充底部：40px； } 身体：：之前{ 背景：url/scnet/includes/images/bg.jpg无重复中心固定； -webkit背景尺寸：封面； -moz背景尺寸：封面； -o-背景尺寸：封面； 背景尺寸：封面； -webkit过滤器：blur5px； -moz过滤器：blur5px； -o型过滤器：5px； -ms过滤器：blur5px； 过滤器：blur5px； } 请登录 电子邮件地址 难忘的数据 暗语 密码重置中的签名 $'input[type=text][id=inputEmail]'。工具提示{/*或使用任何其他选择器、类、id*/ 安置:对,， 触发：聚焦 }; 尝试：

尝试：

---

使用Bootstrap，有多种方法可以实现这一点，包括上面@Garret的建议。如果不知道所有自定义CSS（如果有的话），就很难确切知道您想要的是什么，但另一种方法是，看看上面的代码片段。

使用Bootstrap，有多种方法可以实现这一点，包括上面@Garret的建议。如果不知道所有自定义CSS（如果有的话），很难确切地知道您想要的是什么，但是作为替代，请查看上面的代码片段。

屏幕顶部只有一条40px高的图像线，并按下登录框，应该解释的更多，这是一个响应的背景，涵盖了整个屏幕，所以作为一个块显示，并增加了一个高度，使-webkit背景大小：封面；多余。请参阅我编辑的答案。我假设您希望在：：before伪元素上而不是正文上使用背景图像是有特殊原因的。谢谢，我对代码进行了一些编辑并使其正常工作，谢谢：屏幕顶部只有一条40px高的图像线，并按下了登录框，应该解释的更多，这是一个响应的背景，涵盖了整个屏幕，所以作为一个块显示，并增加了一个高度，使-webkit背景大小：封面；多余。请参阅我编辑的答案。我假设您希望在：：before伪元素上而不是正文上使用背景图像是有特殊原因的。谢谢，我对该代码进行了一些编辑并使其正常工作，谢谢：

body {
  padding-top: 40px;
  padding-bottom: 40px;
  position: relative;
}

body::before {
  background: url(/scnet/includes/images/bg.jpg) no-repeat center center fixed;
  content: '';
  z-index: -1;
  width: 100%;
  height: 100%;
  position:absolute; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  filter: blur(5px);
}