1

Bootstrap 3 プロジェクトで、列幅が px で固定されたテーブルが必要です。<th>私のテーブル<table id="items" class="table table-striped table-condensed">にはすべてありますstyle=##pxが、割り当てられていません。style="width:auto; overflow: scroll;"テーブルに追加しようとしましたが、うまくいきません。また、テーブルのすべてのクラスを削除しようとしましたが、列が大きくなりません。

助けてください！

4

3 に答える 3

9

<colgroup>セクションを指定できます。

<table>
    <colgroup>
        <col span="1">
        <col span="1">
    </colgroup>
    ...
</table>

...次に、CSS で列の幅を設定します。

col {
    width:200px;
}

テーブル要素でブートストラップ クラスを使用している場合は.table、テーブルの幅も に設定する必要がありますauto。

このjsfiddleを参照してください。

于 2013-11-15T03:21:44.577 に答える
2

ブートストラップ 3 は、 に a を適用width: 100%し<table class="table">ます。これを尊重するために、ブラウザーはセルを引き伸ばして残りのスペースを埋めます。Chrome 35 (私は他に何もテストしていません) では、ルールは次のようです:

  1. すべてではなく一部の列が固定されている場合、固定された列幅が適用され、テーブルの残りの幅は幅が指定されていない残りの列に分割されます。

  2. すべて<col>または<colgroups>指定された (固定) 幅がある場合、ブラウザーは幅を表の幅に比例するパーセンテージのように処理しようとします。したがって、テーブル内の 2 つの列の幅がそれぞれ 100px と 200px の場合、それぞれ幅の 33% と 66% になる場合があります。ただし、これは常に当てはまるとは限りません。この動作のルールは非常に複雑で、おそらくブラウザ固有のものです。

いくつかの例といくつかの実験については、このフィドルを参照してください。

http://jsfiddle.net/bzuillsmith/Nuhxj/129/

于 2014-05-30T18:25:41.357 に答える