Question

您好我的背景图片需要帮助。我想将一个图像用于多个部分。如果我滚动图像应该保留。当我链接HTML标记中的图像时，它可以正常工作。但后来没有回应。我也在身体标签上尝试过它。

我正在使用twitter bootstrap frameweork。

任何人都可以提前帮助，谢谢！

CSS

background: url(../img/bg.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;

HTML

<!-- Intro Section -->
<section id="intro" class="intro-section">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
            </div>
        </div>
    </div>
</section>

<!-- About Section -->
<section id="about" class="about-section">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <h1>About Section</h1>
            </div>
        </div>
    </div>
</section>

Answer 1

我认为您的代码中缺少某些内容。请参阅以下示例：

    body {
        background: url('/Images/Hero.png') ghostwhite no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        -ms-background-size: cover;
        background-size: cover;
    }

还要确保样式附加到最顶层的包装器或div。

在旁注中，有时指定＆＃39;容器＆＃39;上课会导致意外的CSS问题。尝试删除它。

Answer 2

要将一个图像用于多个部分，请使用background-size：覆盖CSS属性。使用以逗号分隔的节选择器。

.intro-section, .about-section {
             background: url(images/slide1.jpg) no-repeat center center fixed;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            background-size: cover;
            -o-background-size: cover;

          }

Bootstrap 3背景图像多个部分

2 个答案: