Question

我的标题横幅设置为宽度100％，但它不覆盖顶部的所有内容，它看起来像是70％而文本没有设置为居中，当我在chrome中检查元素时它显示100％宽度但在实际显示中它不是。我该如何解决这个问题？

main.html中

<div class="row">
    <div class="col-md-12">
        <div class="header-banner">
            <h1>Server</h1>
        </div>
    </div>
</div>

的main.css

.header-banner {
    background:url('../img/header_master.jpg');
    width:100%;
    min-height:70px;
    background-repeat: no-repeat;
    text-align: center;
}

Answer 1

试一试：

.header-banner {
        background:url('../img/header_master.jpg');
        width:100%;
        min-height:70px;
        background-repeat: no-repeat;
        text-align: center;
        background-size: cover;
    }

Answer 2

Bootstrap行具有与之关联的边距。所以当使用bootstrap行时，除非你在CSS中删除它，否则总会有一个余量。

如何将背景图像设置为全长并使文本对齐中心？

2 个答案: