0

我使用引导程序来创建响应式网络。我将在 css 中使用我的代码制作全宽标题：

@media (max-width: 767px) {
body { padding-left: 20px; padding-right: 20px; }
.navbar{margin-left:-20px !important;margin-right:-20px !important;width: 100% !important;}
}

这个 html 文件：

<body>
<header>
<div class="navbar">
    <div class="navbar-inner">
        <div class="container">
            <!--content-->
        </div>
    </div>
</div>
</header>

为什么我的标题不能全宽，右边的任何分配空间。请查看： 注意：我在正文上使用填充，因为正文（滑块和标题除外）想要使用填充。

]：http ://www.flickr.com/photos/99517249@N07/9512136615

4

1 回答 1

0

您的 CSS 将标题拉到左侧，因此是空格.. 试试这个：

CSS

@media (max-width: 767px) {
body { padding-left: 20px; padding-right: 20px; }
}

HTML

<body>
<header>
<div class="navbar">
    <div class="navbar-inner">
        <div class="container">
            <!--content-->
        </div>
    </div>
</div>
</header>

这是一个 jsfiddle 供您使用：http: //jsfiddle.net/msturdy/HJsLR/

这一切都基于Bootstrap 3

请注意，如果您希望它是真正的全角，请从您的css中删除padding-leftandpadding-rightbody{}

于 2013-08-15T04:38:40.720 回答