如何修复背景附件？

2 回答

• 1

  当background为 fixed 时，它相对于 body 元素，这就是为什么 100% 100% 的设置大小比应用图像的 div 更大的宽度 . 它将等于body width 而不是 div .

  如果你想设置固定的 height 而不是你需要在 px 中设置它，但在这种情况下，图像不会保存它的比例：

  div {
    background: url(//c6.staticflickr.com/8/7389/26907631325_f8b05bb68d_c.jpg) fixed left top/100% 433px no-repeat;
    width: 800px;
    height: 433px;
  }
  
  html {
    height: 10000px;
  }
  

  <div>
    
  </div>
  

  回复于 2024-04-28T07:30:31+08:00
• 0

  • 您的图像略大于500像素，因为边框被视为图像的一部分 . 使用此方法，您的背景图像将为502x502 .

  • 在背景专用上，您可以指定最大宽度和最大高度，以使图像不会小于选定的像素数 .

  当我更改视口大小时，为什么背景图像的大小会发生变化？

  这是因为您将图像大小设置为％ . ％属性占用其父级的％大小 . 在我们的例子中，父视图是视口（相当于 vh 和 vw ），如果更改视口大小，它将更改大小 .

  回复于 2024-04-28T07:30:31+08:00