Question

这是一个代码

<style type="text/css">.BreakWord {word-break: break-all; }

 <table width=40>
  <tr>
  <td class=BreakWord>
  hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh
  </td>
  </tr>
  </table>

但它没有包装文字。

任何想法？

感谢名单

Answer 1

请注意，上述答案不适用于FF和其他几个浏览器。我在谷歌的几个不同的网站上采取了我的例子。我已经在ff 5.0，IE 8.0和Chrome 10上测试了这个。

.wrapword{
white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
white-space: -pre-wrap;      /* Opera 4-6 */
white-space: -o-pre-wrap;    /* Opera 7 */
white-space: pre-wrap;       /* css-3 */
word-wrap: break-word;       /* Internet Explorer 5.5+ */
word-break: break-all;
white-space: normal;
}

<table style="table-layout:fixed; width:400px">
    <tr>
        <td class="wrapword">
        </td>
    </tr>
</table>

Answer 2

见：

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
    <style type="text/css">.BreakWord {word-break: break-all; }</style>
</head>
<body>

    <div>
    <table width="40px"  style="table-layout:fixed;">
  <tr>
  <td class="BreakWord">
  hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh
  </td>
  </tr>
  </table>

    </div>
</body>
</html>

Answer 3

添加table-layout:fixed; 到你的桌子。它也是word-wrap: break-word;。

Answer 4

尝试将此代码用于您的手机：

<style type="text/css">.BreakWord {white-space: normal; }

如何包装单元格的文本？

4 个答案: