html – 在百分比宽度的表格单元格中打破长字

发布时间：2020-12-14 21:39:33 所属栏目：资源来源：网络整理

导读：http://jsfiddle.net/L2yLe/ 小提琴说这一切。我想要一个仅限于CSS的解决方案，将表的宽度限制为div的宽度。长字符串应该被破坏(但是你可以看到它不是)，这会导致表溢出。我不想使用任何像素宽度。这应该是完全流动的。 divtable tr td short string /td td

http://jsfiddle.net/L2yLe/

小提琴说这一切。我想要一个仅限于CSS的解决方案，将表的宽度限制为div的宽度。长字符串应该被破坏(但是你可以看到它不是)，这会导致表溢出。

我不想使用任何像素宽度。这应该是完全流动的。

<div>
<table>
    <tr>
        <td>
            short string
        </td>
        <td>
somereallylongstringofdatasomereallylongstringofdatasomereallylongstringofdata
        </td>
        <td>
            short string
        </td>
    </tr>
</table>
</div>

div {
    width: 50%;
    background-color: darkgray;
    padding: 15px;
    margin: 10px auto;
}
table {
    border-collapse: collapse;
}
td {
    border: 1px solid black;
}

解决方法

有人看看 http://blog.kenneth.io/blog/2012/03/04/word-wrapping-hypernation-using-css/

/* Warning: Needed for oldIE support,but words are broken up letter-by-letter */
   -ms-word-break: break-all;
   word-break: break-all;

   /* Non standard for webkit */
   word-break: break-word;

   -webkit-hyphens: auto;
   -moz-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!