html表格内容超出时隐藏和换行

来源:互联网 发布:c 语言应用领域 编辑:程序博客网 时间:2024/05/14 12:29

表格内容超出时隐藏:

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8"><style>    table{    table-layout:fixed; /*使水平布局不受单元格的内容的影响*/    }    td{        width:50%;        overflow:hidden;/*文本超出时隐藏*/        white-space:nowrap;/*规定表格单元格中的内容不换行。*/    }</style></head><body>    <table border="1px" width="100px">    <tr><td>333333333333</td><td>333333333333</td></tr>    <tr><td>123333333</td><td>3333333333334444</td></tr>    <tr><td>123333333</td><td>33333333333344444</td></tr>    <tr><td>123333333</td><td>33333333333344444</td></tr>    </table></body></html>

注:必须设置table的具体宽度,td的宽度设置使用百分制。不可直接给td设置具体的宽度数值。

表格内容超出时换行:

给td设置word-break:break-all。