css - 使用 twitter bootstrap 为不同页面提供不同的填充

Question

我正在开始一个新的 Rails 项目并添加了 twitter bootstrap（因为我听说过它的好消息）。这是一个初学者的问题，但是，如何添加跨越页面整个高度/宽度的背景图像，而不让 twitter-bootstrap 的默认顶部和左侧填充妨碍？有没有我还没有遇到的基本设置？如何删除特定页面的填充，但仍然让填充保留在应用程序的其余部分？这种填充有用吗？

谢谢

Answer 1

您可以将背景图像添加到正文，因为它不会受到填充的影响

body.my-page{
  background-image: url('my-image');
  height: 100%;
  width: 100%;
} 

或添加一个absolute具有完整宽度和高度的 / 'fixed' 定位容器，并将背景图像应用于该容器。

<div class="bg"></div>
</body>

CSS

.my-page .bg{
  background-image: url('my-image');
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1;
} 

.my-page .container{
  position: relative;
  z-index: 2;
}