如何在这个Jumbotron Class

时间:2016-01-04 00:07:39

标签: html css twitter-bootstrap

所以我无法弄清楚如何让这个jumbotron div拥有指定的背景图像。之前我在另一个项目中使用它时工作但是当我将它导入另一个项目时它才停止显示。其他一切都有效,所以我只是忘记了css风格或其他东西,但我试过了,我似乎无法找到任何错误。我正在使用bootstrap,但已经编辑了该库中的任何值,它似乎在其他项目中工作正常。可能导致的一件事是bootstrap的版本我从Bootstrap 3.0.0版获得了这段代码,目前我使用的是版本3.3.4。不确定这是否与它有关。作为最后一个注释,图像有效,因为我在页面上显示不同的div。

HTML

<div class="jumbotron">
        <div class="container">
            <div class="topTitle">
                <div>
                    <div class="col-lg-9">
                        <h1>Insert <span>Topic</span></h1>

                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>

                    </div>
                </div>
            </div>
        </div>
    </div>

CSS

.jumbotron {
    background: url('images/intro-bg.jpg') !important;

    background-attachment: fixed !important;
}

.jumbotron p {
    padding: 20px 0;
}

.jumbotron .topTitle h1 {
    margin-top: 50px;
}

结果 Incorect

1 个答案:

答案 0 :(得分:0)

所以我明白了。我使用了开发工具,就像吉姆加里森所说的那样,它揭示了没有什么可以覆盖它所以它应该工作。所以我随机尝试将样式直接放入html中,如此

<div class="jumbotron" style="background: url('images/intro-bg.jpg'); background-attachment: fixed;">

无论出于何种原因,这似乎都有效,所以我希望将来有谁可以帮助这个问题......或者提出更好的解决方案。