是如何防止表格被撑大、拉长、变形?

最新推荐文章于 2023-08-30 18:05:36 发布

lijaystu

最新推荐文章于 2023-08-30 18:05:36 发布

阅读量1.8k

点赞数

文章标签：算法 table border 编程 css

本文链接：https://blog.csdn.net/lijaystu/article/details/2692229

版权

本文介绍如何使用CSS样式控制HTML表格中的内容换行与显示。通过设置不同的样式属性，如word-break和table-layout，可以实现表格内容的自动换行及固定布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

table>
<tr>
    <td style="word-break:break-all;">
       ContentContentContentContentContentContentContentContentContentContentContentContentContentContent
    </td>
</tr>
</table>

只要为单元格加上一个样式：“style="word-break:break-all;" ”就可以了。简单吧……

以下是来自编程爱好者的：

表格的折行处理.

＜table style="TABLE-LAYOUT: fixed" width="200" border="0" cellspacing="0" cellpadding="7" bgcolor="#f7f7f7"＞
＜tr＞
＜td style="LEFT: 0px; WIDTH: 100%; WORD-WRAP: break-word"＞
dffadfdaqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqsfdffadfdasfdffadfdasfdffadfdasfdffadfdasfdffadfdasfd
ffadfdasfdffadfdasfdffadfdasfdffadfdasf
＜/td＞
＜/tr＞
＜/table＞

此处主要是用css样式进行控制在＜table＞标签中有个style="TABLE-LAYOUT: fixed",其说明如下

语法：

table-layout : auto | fixed

参数：

auto : 　默认的自动算法。布局将基于各单元格的内容。表格在每一单元格读取计算之后才会显示出来。速度很慢
fixed : 　固定布局的算法。在这算法中，水平布局是仅仅基于表格的宽度，表格边框的宽度，单元格间距，列的宽度，而和表格内容无关,此时在＜td＞标签中如果没有WORD-WRAP: break-word样式,表格中的内容将只能显示一部份,具体看表格的宽度了.word-wrap说明如下:

语法：

word-wrap : normal | break-word

参数：

normal : 　允许内容顶开指定的容器边界
break-word : 　内容将在边界内换行。如果需要，词内换行（word-break）也会发生

两种方法都可以用哦……