css tr标签自动换行,HTML中table设置td标签内容过多自动换行

今天遇到一个小问题，需要解决table标签中td标签内容过多自动换行的问题。

因为之前有经验(无论是内容过多省略显示还是内容过多换行都做过)，这次的需求是内容过多换行显示。

首先在 table 上增加 style=”table-layer:fixed” ;然后在 td 上增加 style=”WORD-WARP:break-word” 。

果然，td的内容完全显示了。

最开始的效果

但是貌似格式错了。并且我发现，无论我怎么设置td的宽度(通过百分比或者px设置宽度)，都没法解决；我看出来了，table上面的style=”table-layer:fixed”把我所有td的宽度设为一样了。

找了半天，终于找到了解决方法，需要在table里面开始的地方设置显示格式

设置格式

......

显示内容

设置格式的代码：

然后出现效果(正常了)：

正常的效果

说明：不要在意企业通讯地址这个细节。。。

然后我想了想，table下面那么多标签，说不定还有其他小老弟可以(截图来自W3school)

table的其他元素

然后我试了试，发现colgroup具有同样的效果，所以我决定用col。

记录下来，下次能快速解决。

css tr标签自动换行,HTML中table设置td标签内容过多自动换行相关推荐

table 设置 td 标签宽高
table 设置 td 标签宽高在默认情况下,table 中的 td 不允许使用 css 来设定宽高,需要为 table 改变一些参数之后才可使用 CSS 来随心控制. <table bord ...
[css] 使用rem布局时怎样合理设置根标签字体大小？
[css] 使用rem布局时怎样合理设置根标签字体大小? UI出2倍稿,然后用js计算当前设备和UI设计稿之间的比例关系,通过resize实时计算根标签字体大小,即可. 个人简介我是歌谣,欢迎和大家 ...
标签打印软件中如何设置镜像
在用标签打印软件设计标签的时候有些客户可能会用到镜像功能,在标签打印软件中镜像的设置有两种情况,第一种是把某个对象设置镜像, 第二种是把整个标签设置镜像,接下来我们就看下这两种镜像功能如何设置. 第一 ...
vue修改meta值_vue中动态设置meta标签和title标签的方法
vue中动态设置meta标签和title标签的方法因为和原生的交互是需要h5这边来提供meta标签的来是来判断要不要显示分享按钮,所有就需要手动设置meta标签,标题和内容 //router内的设置 ...
css里td自带什么属性,关于css标签的属性（text文本属性，背景background，表格标签table，td标签属性）...
简介这篇文章主要介绍了关于css标签的属性(text文本属性,背景background,表格标签table,td标签属性)以及相关的经验技巧,文章约1129字,浏览量216,点赞数4,值得参考! te ...
HTML5 audio 标签-在html中定义声音的标签
2019独角兽企业重金招聘Python工程师标准>>> 本文来源 169it HTML 5 <audio> 标签定义和用法 <audio> 标签定义声音,比如 ...
HTML网页中table居中和表格内容居中
HTML网页中table居中和表格内容居中 1.html中让表格在浏览器中左右居中,可以设置表格的align属性 align三个属性: 居中:center:靠左:left:靠右:right. 2.在表 ...
html 使table 页面居中,HTML网页中table居中和表格内容居中
HTML网页中table居中和表格内容居中 1.html中让表格在浏览器中左右居中,可以设置表格的align属性 align三个属性: 居中:center:靠左:left:靠右:right. 2.在表 ...
php css去除h1样式,HTML中怎么设置h1的字体样式你知道吗？关于设置h1标签的样式详解...
本篇文章主要为大家讲解了html中的h1标签的样式解析,但是如果不用css样式来做的话,那就只能在html4.01中显示了,所以我们还是尽快学习css层叠样式表吧,好了,现在让我们来说说这篇文章吧. ...

css tr标签自动换行,HTML中table设置td标签内容过多自动换行

css tr标签自动换行,HTML中table设置td标签内容过多自动换行相关推荐

最新文章

热门文章