有没有可能让一个没有元素的HTML div变得模糊？

Question

我想要模糊dive的背景，或者任何没有内部元素的html容器。好吧，我试着用谷歌搜索它，发现它可以通过html2canvas (从对象下面创建图像，然后模糊它)，也使用-webkit-backdrop-filter还没有效果。我想要的是一个活生生的模糊容器，类似于下面截图中的windows10菜单背景。

​

​

Answer 1

我会使用Photoshop或其他工具模糊原始背景，然后将其作为背景图像并处理位置。如下所示：

container {
 background-image: url("blurredbg.png");
 background-repeat: no-repeat;
 background-position: 30px 0px;
} 

有关背景定位的更多信息，请参考this page。

当然，您可以在javascript中使用container.style.backgroundPosition="100% 0";动态控制定位

Answer 2

我猜你可以使用下面的stackoverflow来回答check if div have elements。如果元素不存在，那么您可以使用document.getElementById("yourId").blur();模糊您的div，您可以参考learn more about blur