Question

那么为什么当我为我的网站插入背景图像时，它变得模糊并使图像看起来比我最初没有将其拉伸以覆盖页面时更糟，这里是元素代码。

>

 <style type="text/css">
      body {
          margin-left: 15%;
          margin-right: 15%;
          border:10px dotted black;
          padding: 10px 10px 10px 10px;
          font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
          background-image:url(nope.jpg.jpg);
          background-repeat: no-repeat;
          background-attachment: fixed;
          background-size: cover;
          image-rendering: pixelated;
          background-size: 1500px 1000px;
      }
    </style>

我是一名新手程序员，所以可能是因为图像最初很小，它的尺寸为 300px,150px 不适合页面，所以我将其拉伸，现在它适合页面但模糊。是否有任何特定代码可以解决此问题，还是我必须找到另一张图片？

Answer 1

您的图像对于视口来说可能太小了。您必须找到一个高清且相当大的图像。这是一个好主意，因为在选择背景图片时，找到一个对于网站来说太大的图片，这样，它就适用于所有设备。

此外，如果您提供您使用的图像也会有所帮助，这样我就可以看到实际问题，而不仅仅是猜测。

Answer 2

Background-size: cover

将使任何图像拉伸到定位区域的大小。如果您希望图片成为网站的整个背景，则需要具有更高像素数的更高质量的图片。

我如何修复模糊的背景图像

2 个答案: