1

我对最基本的 Bootstrap (2.3.2) 结构有疑问，我似乎无法连续/连续获得 4x 3spans。第四个被推低了一个级别。添加到响应式 css 文件的链接时，我得到相同的结果。如果不玩边距，我无法让它们“适合”在一条线上，但我不应该/不需要。非常感谢你的帮助！ķ

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8"/>
        <title>Bootstrap Index</title>
        <script type="text/javascript"></script>
        <link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>


    </head>
    <body><div class="container">
        <header>
            <div class="row">

                    <h2 class="span12">Portfolio</h2>

            </div>
        </header>
        <nav>

                <div class="row">
                    <div class="span12">
                        <div class="span3"><a href="indexREDO.html">Home</a></div>
                        <div class="span3"><a href="NewsREDO.html">News</a></div>
                        <div class="span3"><a href="GalleryREDO.html">Gallery</a></div>
                        <div class="span3"><a href="ContactREDO.html">Contact</a></div>
                    </div>
                </div>

        </nav>
        <section>

                <div class="row">
                    <div class="span12">
                        <img src="img/bridge.jpg" alt="..picture here.."/>
                    </div>

            </div>
        </section>
        <script type="text/javascript" src="js/jQuery.1.10.2.js"></script>
        <script type="text/javascript" src="js/bootstrap.js"></script>
        <!-- Put your other scripts here -->
        <footer></footer>
    </div>
    </body>
</html>
4

1 回答 1

2

删除<div class="span12" />元素并让.span3s 自己驻留在行内。

<div class="row">
    <div class="span3"><a href="indexREDO.html">Home</a></div>
    <div class="span3"><a href="NewsREDO.html">News</a></div>
    <div class="span3"><a href="GalleryREDO.html">Gallery</a></div>
    <div class="span3"><a href="ContactREDO.html">Contact</a></div>
</div>

或者，您可以在跨度内嵌套一个新行。行类重置填充/边距，以便您可以利用它嵌入的跨度的整个宽度。

<div class="row">
    <div class="span12">
        <div class="row">
            <div class="span3"><a href="indexREDO.html">Home</a></div>
            <div class="span3"><a href="NewsREDO.html">News</a></div>
            <div class="span3"><a href="GalleryREDO.html">Gallery</a></div>
            <div class="span3"><a href="ContactREDO.html">Contact</a></div>
        </div>
    </div>
</div>
于 2013-08-15T22:45:37.663 回答