html table怎么实现不换行显示-木庄网络博客

本文摘自PHP中文网，作者藏色散人，侵删。

html table实现不换行显示的方法：首先打开相应的HTML代码文件；然后在table下的“td,th”中加入样式“word-break: keep-all;word-wrap:break-word;”即可实现不换行显示的效果。

本文操作环境：windows7系统、HTML5&&CSS3版、Dell G3电脑。

html的table中不换行显示的效果

table中，如果需要单元格中不换行，在table 下的td,th中加入样式

1 2	`word-break: keep-all;` `word-wrap:break-word;`

word-break: keep-all;这种情况在中文下，也不会换行

word-wrap:break-word;英文不会换行

如果中间有空格，在空格处默认会换行，如果需要不换行，使用下面样式

1	`white-space: nowrap;`

这种情况，一般是不需要设置table中的宽度的，table会根据内容自动调节

【推荐学习：HTML视频教程】

相关阅读 >>

更多相关阅读请进入《Html》频道 >>

书籍

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者