如何在HTML中将表格列宽指定为固定大小?

时间:2016-03-25 17:15:19

标签: html css

我有一张表,里面有几行和几列。我坚持的是每当字段长度增加时列的宽度

所以,比方说,例如,我有一个表格:

<table>
  <thead>
    <tr>
     <th>column1</th>
     <th>column2</th>
    </tr>
  </thead>

  <tbody>
    <tr>
     <td>valuenfkdkfkdsnfndfndnkffdfndsfnndfnksfnfsfsdnsffs</td>
     <td>value2</td>
    </tr>
  </tbody>
</table>

具有字段长度为35-50个字符的值,如第一个“td”标记中的那个,表格超出规定的网页区域。

我使用{word-wrap:break-word;}但似乎没有效果。在这种情况下,有没有办法将字段长度切割到下一行,并将列宽设置为固定大小?

1 个答案:

答案 0 :(得分:1)

您可能正在寻找CSS属性table-layout:fixed

<table class="users" style="table-layout:fixed;">
  <tbody>
    <tr>
      <td>0001</td>
      <td>Johnny Five</td>
    </tr>
 </table>

OR

CSS:

table.users{table-layout:fixed;}

来源:https://css-tricks.com/fixing-tables-long-strings/