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

最新推荐文章于 2024-08-10 12:02:24 发布

qinchao888

最新推荐文章于 2024-08-10 12:02:24 发布

阅读量6.1k

点赞数 1

分类专栏： html 文章标签： html

本文链接：https://blog.csdn.net/GreyBearChao/article/details/73500365

版权

html 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

表格内容超出时隐藏：

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