table中内容过长,table改变的问题
2018-01-08 11:12
369 查看
在看效果时发现在Chrome中的table已经不是原来设置的宽度了,而其他浏览器是好的,经过百度发现是单元格内容过多造成的,但这时候给td设置宽度已经不适用了,此时就要给table设置 table{table-layout:fixed;}
table-layout属性
用法:作用于table标签,显示单元格列宽的计算法则。
取值:auto(默认)列宽由内容确定。加载慢
fixed :固定布局的算法。在这种算法中,表格和列的宽度取决于 col 对象的宽度总和,假如没有指定,则会取决于第一行每个单元格的宽度。假如表格没有指定宽度( width )属性,则表格被呈递的默认宽度为 100% 。说明:设置或检索表格的布局算法。。加载快。
常见问题,第一行设置单元格合并后,第二行的宽度显示为平分。
解决办法,加一个隐形行设定为第一行,display:none;
table{word-break:break-all; word-wrap:break-word; table-layout:fixed; }
table-layout属性
用法:作用于table标签,显示单元格列宽的计算法则。
取值:auto(默认)列宽由内容确定。加载慢
fixed :固定布局的算法。在这种算法中,表格和列的宽度取决于 col 对象的宽度总和,假如没有指定,则会取决于第一行每个单元格的宽度。假如表格没有指定宽度( width )属性,则表格被呈递的默认宽度为 100% 。说明:设置或检索表格的布局算法。。加载快。
常见问题,第一行设置单元格合并后,第二行的宽度显示为平分。
解决办法,加一个隐形行设定为第一行,display:none;
word-wrap : normal | break-word 取值: normal : 默认值。允许内容顶开指定的容器边界break-word : 内容将在边界内换行。 如果需要,词内换行( word-break )也将发生说明:设置或检索当当前行超过指定容器的边界时是否断开转行。
word-break : normal | break-all | keep-all 取值:normal : 默认值。 允许在词间换行break-all : 该行为与亚洲语言的 normal 相同。也允许非亚洲语言文本行的任意字内断开。 该值适合包含一些非亚洲文本的亚洲文本keep-all : 与所有非亚洲语言的 normal 相同。对于中文,韩文,日文,不允许字断开。 适合包含少量亚洲文本的非亚洲文本说明:设置或检索对象内文本的字内换行行为。尤其在出现多种语言时。 对于中文,应该使用 break-all 。
table{word-break:break-all; word-wrap:break-word; table-layout:fixed; }
相关文章推荐
- table中内容过长,table改变的问题
- iOS之如何处理TableView cell内容不一致以及cell复用重叠的问题
- Qt中的QStandardItemModel内容改变并通过TableView同步显示。
- 通过JS动态改变table中<td>的内容
- (遇到的一个问题)空指针引用, 是可以改变这个指针所指内容的。
- HTML怎么让table表格中的td单元格内容过长显示为固定长度,多余部分用省略号代替?
- 解决boostrap-table有水平和垂直滚动条时,滚动条滑到最右边表格标题和内容单元格无法对齐的问题
- ios开发笔记之如何让tableView根据文本内容动态改变cell的高度
- bootstrap-table 表头,和内容对齐问题
- 独创共识机制POI:他们想改变原创内容的商业模式,帮助中小型的优质IP解决早期变现问题
- mvc index 用table显示内容,文字过长时用......表示
- 如何使STATIC控件的背景透明以及动态改变控件文本内容时闪烁的问题
- bootstrap-table设置height后表头与内容无法对齐的问题
- HTML怎么让table中的td内容过长显示为固定长度,多余部分用省略号代替
- css解决table中无内容边框显示不出来的问题
- Asp.net中在GridView数据绑定事件中改变显示内容要注意的问题
- tableviewcell 自动调整textfiled的键盘遮挡问题 UITableViewController中的tableview做可以自适应键盘高度来改变tableview的额外高度。
- 解决select选项内容过长,文字显示不全的问题
- iOS11 tableView内容向下偏移20pt或向下偏移64pt的问题?
- 改变table中checkbox选中行的内容