整个单词包装而不是字符

时间:2016-05-14 18:31:07

标签: html css

我无法在表格中找到文字来包装我想要的方式。如果一个单词不适合该行的其余部分,我希望它包装整个单词并将整个单词放在下一行。目前它看起来像这样:enter image description here

所以在这个例子中:" Vince"被打破了,并且#34;放在下一行。在这种情况下,我希望它将整个单词放在下一行。

我试图摆弄自动换行和空白属性,但是我能让它在一个单词中间不破的唯一方法就是让它完全不包裹而下一步在屏幕的一侧。

HTML / CSS中是否有解决此问题的方法?

1 个答案:

答案 0 :(得分:3)

使用word-wrap:normal;

示例:



.test {
  width: 11em;
  border: 1px solid #000000;
  word-wrap: normal;
}

<table class="test">
  <tr>
    <th>Col A
    </th>
    <th>Col B
    </th>
  </tr>
  <tr>
    <td>This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.(Breaking words only at allowed break points)
    </td>
    <td>hello texthello texthello texthello text
    </td>
  </tr>
</table>
&#13;
&#13;
&#13;