HTML – 如何从模糊背景图像中删除白色边框

前端之家收集整理的这篇文章主要介绍了HTML – 如何从模糊背景图像中删除白色边框前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何从背景图像中删除白色模糊边框.
  1. <div class="background-image"></div>

CSS,我尝试添加保证金:-10px但它不起作用

  1. .background-image {
  2. background: no-repeat center center fixed;
  3. background-image: url('http://www.hdpaperz.com/wallpaper/original/windows-8-wallpapers-2560x1600-2311_1.jpg') ;
  4. background-size: cover;
  5. display: block;
  6. height: 100%;
  7. left: -5px;
  8. top:-5px;
  9. bottom:-5px;
  10. position: fixed;
  11. right: -5px;
  12. z-index: 1;
  13. margin:0px auto;
  14. -webkit-filter: blur(5px);
  15. -moz-filter: blur(5px);
  16. -o-filter: blur(5px);
  17. -ms-filter: blur(5px);
  18. filter: blur(5px);
  19. -webkit-background-size: cover;
  20. -moz-background-size: cover;
  21. -o-background-size: cover;
  22.  
  23. }

http://jsfiddle.net/maio/8wq132nd/1/

解决方法

最简单的方法添加transform:scale(1.1).
试试吧 here.
  1. #overlay {
  2. position: fixed;
  3. left: 22.5em;
  4. top: 3em;
  5. height: 75%;
  6. width: 50%;
  7. background: url("https://s-media-cacheak0.pinimg.com/originals/ae/b4/c5/aeb4c53cab2b550187644af503a0f17e.png");
  8. background-size: cover;
  9. filter: blur(9px);
  10. transform: scale(1.1);
  11. }

猜你在找的HTML相关文章