如何使td溢出进入多行



我需要使td溢出作为文本区域进入多行。

HTML

<table class="table">
  <tr>
    <td>Jill</td>
    <td style="max-width:200px;overflow-y:scroll;">Smithasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdf</td> 
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
    <td>94</td>
  </tr>
</table>

Fiddle here

当在文本中发现空格时,文本的换行是有效的,您在上面的td中写的文本没有任何空格,请添加空格,然后它将开始在多行上流动。

这是由于您的文本。你的文本中没有空格。只需在文本中添加一些空白即可。您可以在此处查看

    <table class="table">
      <tr>
        <td>Jill</td>
        <td style="max-width:200px;overflow-y:scroll;">
        Smithasdfas
        dfasdfasdfasdfa sdfasdfasdfasdfasdfasdfasdfasdfasd 
asdfasdfasdfasdfasdfasdfasdfasdfasdfasdf 
</td> 
        <td>50</td>
      </tr>
      <tr>
        <td>Eve</td>
        <td>Jackson</td> 
        <td>94</td>
      </tr>
    </table>

最新更新