Question

无论内容是什么，我都试图修正宽度。但是，表的宽度根据其内容而变化。我该如何解决？

这是我的代码：

<style>
           table{width:25px; background:#66f;}
    </style>
    <table>
           <tr>
                   <td>sn</td>
                   <td style="width:20px;">Name</td>
           </tr>
           <tr>
                   <td>1</td>
                   <td>Wolfeschlegelsteinhausenbergerdorff</td>
           </tr>
    </table>

Answer 1

试试这个

<table>
    <tbody><tr>
        <td>sn</td>
        <td style="width:20px;">Name</td>
    </tr>
    <tr>
        <td>1</td>
        <td style="word-break: break-all;">Wolfeschlegelsteinhausenbergerdorff</td>
    </tr>
</tbody>
</table>

Answer 2

您需要使用table-layout: fixed;并相应地向width和table元素提供td。

您还应该使用word-wrap: break-word;，以便在遇到非破坏字符串时不会遇到麻烦

Demo

Answer 3

您没有提到带有点扩展名的样式类表，并且不会使用class属性调用它。

以下是代码：

<style>
        .table{
          width:25px; background:#66f;
        }
</style>
    <table class="table">
        <tr>
           <td>sn</td>
           <td style="width:20px;">Name</td>
        </tr>
        <tr>
           <td>1</td>
           <td>Wolfeschlegelsteinhausenbergerdorff</td>
        </tr>
   </table>

如何独立修复表格宽度内容？

3 个答案: