今天我想重新设计我的网站并以不同的方式处理它。我并没有专注于排版，而是添加了大图像和小文本。我简单地做了：
html {
background: url(../img/background.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
filter: blur(10px);
-webkit-filter: blur(10px);
-moz-filter: blur(10px);
-o-filter: blur(10px);
-ms-filter: blur(10px);
}
...但是，当我在浏览器（Chrome 版本 26.0.1386.0 dev，在 Ubuntu 12.10 上运行）中看到它时，图像模糊，但也出现褪色的白框。这是这个问题的截图.
有什么办法可以解决这个问题吗？我看了一下这个堆栈溢出问题但无法让它工作（部分原因是该示例使用了<img>标签，不仅仅是一个<html>一）。那个白色的框架看起来不太美观。不，该图像没有白框（这只是我的桌面的屏幕截图，打开了几个窗口，因此不存在白框）。有什么想法为什么会发生这种情况吗？
感谢您的帮助和时间。
如果您有可能，我发现一个很好的解决方法是使图像大于包含的图像<div>，并用夹子修剪边缘overflow: hidden.
就你而言，因为它是整个<html>标签，我会把图像放在<div>使用以下 CSS：
position: fixed;
top: 0;
left: 0;
transform: scale(1.02); // or whatever scale amount removes the border
这总是对我有用。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
