简单的方案:

  <tr class="something">
    <td>A</td>
    <td>B</td>
    <td>C</td>
    <td>D</td>
  </tr>

我需要为<td>设置一个固定宽度。我试过了:

tr.something {
  td {
    width: 90px;
  }
}

Also

td.something {
  width: 90px;
}

for

<td class="something">B</td>

甚至

<td style="width: 90px;">B</td>

但是<td>的宽度是一样的。


当前回答

对于引导4.0:

在Bootstrap 4.0.0中,你不能可靠地使用col-*类(适用于Firefox,但不适用于Chrome)。 你需要使用OhadR的答案:

<tr>
  <th style="width: 16.66%">Col 1</th>
  <th style="width: 25%">Col 2</th>
  <th style="width: 50%">Col 4</th>
  <th style="width:  8.33%">Col 5</th>
</tr>

对于Bootstrap 3.0:

用twitter引导3使用:class="col-md-*"其中*是宽度的列数。

<tr class="something">
    <td class="col-md-2">A</td>
    <td class="col-md-3">B</td>
    <td class="col-md-6">C</td>
    <td class="col-md-1">D</td>
</tr>

对于Bootstrap 2.0:

与twitter引导2使用:class="span*",其中*是宽度的列数。

<tr class="something">
    <td class="span2">A</td>
    <td class="span3">B</td>
    <td class="span6">C</td>
    <td class="span1">D</td>
</tr>

**如果你有<th>元素设置宽度,而不是<td>元素。

其他回答

在我的案例中,我能够通过使用min-width: 100px而不是width: 100px来修复单元格th或td的问题。

.table td, .table th {
    min-width: 100px;
}

我也有同样的问题,我让表固定,然后指定我的td宽度。如果你有,你也可以做这些。

table {
    table-layout: fixed;
    word-wrap: break-word;
}

模板:

<td style="width:10%">content</td>

请使用CSS来构造任何布局。

使用固定的表布局CSS在表,并设置一个百分比的td。

使用不带td和th的。something

<!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap Example</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <style> .something { width: 90px; background: red; } </style> </head> <body> <div class="container"> <h2>Fixed width column</h2> <table class="table table-bordered"> <thead> <tr> <th class="something">Firstname</th> <th>Lastname</th> <th>Email</th> </tr> </thead> <tbody> <tr> <td>John</td> <td>Doe</td> <td>john@example.com</td> </tr> <tr> <td>Mary</td> <td>Moe</td> <td>mary@example.com</td> </tr> <tr> <td>July</td> <td>Dooley</td> <td>july@example.com</td> </tr> </tbody> </table> </div> </body> </html>

对于Bootstrap 4,你可以简单地使用类帮助器:

<table class="table">
  <thead>
    <tr>
      <td class="w-25">Col 1</td>
      <td class="w-25">Col 2</td>
      <td class="w-25">Col 3</td>
      <td class="w-25">Col 4</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      ...