css - 背景图像似乎溢出容器

Question

我正在使用 Firebug 来处理我的 CSS。

它以 620 像素的高度显示 HTML、Body 和内部容器。我假设我的窗口大约是 640px 高。

使用萤火虫我可以清楚地看到所有元素都在窗口的整个高度附近结束，但是主体 bg-image 似乎占据了整个窗口高度，这超出了它的相对容器的大小。

这是怎么/为什么？

注意：这是一个使用 normalize.css 作为重置的 Drupal 站点。当我谈论高度时，内容上没有填充或边距。

score 1 · Accepted Answer

好吧，看着你的页面，我和你一样生气。但我想我已经找到了发生这种情况的原因。

在这个fiddle中，您可以看到背景属性（颜色、图像...）如果它专门位于body标记上，则会在整个页面上扩展。身体有多大并不重要（它是一个 1x1 的盒子）。

它必须是浏览器行为。这不会改变身体的实际大小。它将遵循正常规则（大小与内容相同，如果设置了特定大小，则如果设置了继承，则与父级相同）。

但是在另一个（将背景颜色设置为具有固定尺寸的内部 div）中，背景颜色不会延伸到整个页面。

尝试创建一个包装器作为您的身体的孩子，并在其上放置身体样式。

<body>
  <div class="all your body classes here">
  </div>
</body>

score 0 · Accepted Answer

0

如果你使用火狐浏览器，你可以按

ctrl+Shift+m

并以你需要的决心

于 2013-06-02T11:02:46.643 回答

2 回答 2