1

假问题的借口。我需要使用 twitter bootstrap 创建 3 个流体列布局。第一列是页面宽度的 45%，第二列是 10%，第三列应该是页面宽度的 45%。

我试过这个：

<div class="container-fluid">
    <div class="row-fluid">
        <div class="span5">
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th>#</th>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Username</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>2</td>
                    <td>Jacob</td>
                    <td>Thornton</td>
                    <td>@fat</td>
                </tr>
                <tr>
                    <td>3</td>
                    <td colspan="2">Larry the Bird</td>
                    <td>@twitter</td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="span2"></div>
        <div class="span5">
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th>#</th>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Username</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>2</td>
                    <td>Jacob</td>
                    <td>Thornton</td>
                    <td>@fat</td>
                </tr>
                <tr>
                    <td>3</td>
                    <td colspan="2">Larry the Bird</td>
                    <td>@twitter</td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>

但是中间一栏太宽了，不是屏幕宽度的 10%。请帮助我了解 twitter bootstrap 中的流畅布局。

4

2 回答 2

2

在具有 12 列流体布局的 Twitter Bootstrap 中，一个span2haswidth: 14.5299%和一个span5has width: 40.1709%。

这是将媒体宽度划分为 12 列及其装订线的结果。

如果您需要不同的发行版，您可以在此处自定义布局：http: //twitter.github.com/bootstrap/customize.html

于 2012-09-23T11:10:16.267 回答
0

如果您需要该比例，只需将 BS 网格系统从 12 列更改为 20 列。然后使用 span9、span2、span9。

但这不会完全达到 45/10/45%。由于BS有排水沟......

于 2013-07-15T09:52:20.380 回答