html - 是背景: no-repeat; needed when you have a fixed sized image?

Question

background: no-repeat; 是固定图像时需要的吗？

我读到，当放置任何背景图像时，它会默认重复。

即使您没有在屏幕上看到它，它是否仍然会重复出现，即使是在固定图像上？

无论如何都需要指定不重复吗？

图像大小为 180 x 180。

<style>
      #playButton4 {
        border: 3px solid #0059dd;
        width: 260px;
        height: 194px;
        cursor: pointer;
        background-color: black;
      }

      .img2 {
        background: url(https://i.imgur.com/4HJbzEq.png);
        background-repeat: no-repeat;
        width: 180px;
        height: 180px;
        margin: 7px 40px;
      }

    </style>

    <div id="playButton4" onclick="">

      <div class="img2"></div>
    </div>

Answer 1

只要元素的大小超过 background-image 的大小，

background-repeat 属性就是相关的。如果您的元素从不发生这种情况，则指定 background-repeat 就是无效代码。

如果在任何情况下，您的元素可能会变得比 background-image 大(在任一方向上)并且您不希望图像重复出现，则应将其保留。

---

作为旁注，background 是一个包含background-repeat 的简写属性，因此:

background: url(https://i.imgur.com/4HJbzEq.png) no-repeat;

完全等同于

background-image: url(https://i.imgur.com/4HJbzEq.png);
background-repeat-x: no-repeat;
background-repeat-y: no-repeat;

，它将您的“死代码”减少到只有 10 个字符。