如何使 td overflow 进入多行？

Question

我需要让 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

Answer 1

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

Answer 2

那是因为你的文字。您的文字中没有whitspace。只需在您的文本中添加一些白色 space 您可以查看 fiddler here

    <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>

如何使 td overflow 进入多行？

How to make td overflow go into multiple lines?

html-table

overflow

twitter-bootstrap

twitter-bootstrap-3