表格td的宽度不随内容自适应
表格td的宽度不随内容自适应
在table上添加 style=”table-layout:fixed;word-break:break-all;”
然后在相应的td上添加宽高即可。
语法:
word-break:normal;
使用浏览器默认的换行规则;
word-break:break-all;
允许在单词内换行;
word-break:keep-all;
只能在半角空格或连字符处换行;
table-layout:automatic;
默认,列宽度由单元格内容设定;
table-layout:fixed;
列宽由表格宽度和列宽度设定;
table-layout:inherit;
规定应该从父元素继承table-layout
属性的值;
所有浏览器都支持 table-layout 属性。
注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit"
。
定义和用法
tableLayout
属性用来显示表格单元格、行、列的算法规则。
固定表格布局:
固定表格布局与自动表格布局相比,允许浏览器更快地对表格进行布局。
在固定表格布局中,水平布局仅取决于表格宽度、列宽度、表格边框宽度、单元格间距,而与单元格的内容无关。
通过使用固定表格布局,用户代理在接收到第一行后就可以显示表格。
自动表格布局:
在自动表格布局中,列的宽度是由列单元格中没有折行的最宽的内容设定的。
此算法有时会较慢,这是由于它需要在确定最终的布局之前访问表格中所有的内容。
说明
该属性指定了完成表布局时所用的布局算法。固定布局算法比较快,但是不太灵活,而自动算法比较慢,不过更能反映传统的 HTML 表。
表格td的宽度不随内容自适应相关推荐
- td 内容自动换行 table表格td设置宽度后自动换行
td 内容自动换行 table表格td设置宽度后自动换行 控制样式 table { table-layout:fixed; WORD-BREAK:break-all; } td { word-wrap ...
- td 内容自动换行 table表格td设置宽度后文字太多自动换行
设置table 的 style="table-layout:fixed;" 然后设置td的 style="word-wrap:break-word;" < ...
- html表格td宽度设置,table以及td宽度设置细节
table中table-layout设置 auto 默认值 在此设置下如果没有指定table的宽度,则table会根据每列td的宽度自动被撑开,如果没有显示指定td的宽度,则td宽度根据内容而定只到t ...
- table td的宽度详解
前言:一直总觉得td的宽度好难驾驭,但万事万物总是有规律的.就像亮剑说的:不用因为怕八路就敬而远之,应该靠上去,熟悉他们,了解他们. 正文: Table只有Table的宽度是可 ...
- html 单元格被撑开_表格单元格td设置宽度无效始终有内部的内容撑开
摘要:这篇HTML栏目下的"表格单元格td设置宽度无效始终有内部的内容撑开",介绍的技术点是"表格单元格.设置宽度.宽度无效.单元格.单元.设置",希望对大家开 ...
- UITableView根据表格内容进行高度自适应与使用Masonry实现根据内容进行宽度自适应和高度自适应
Masonry和SDAutoLayout不同:SDAutoLayout需要上下左右四个方向都显示性的进行约束,虽然当高度和宽度自适应时,可以少一个高度约束,但是也应有对应布局处理设置.因为标签是有顶部 ...
- CSS中设置表格TD宽度的问题
CSS布局,表格宽度不听使唤的实例.想把表格第一例宽度设为20,其他自适应.但CSS中宽度是等宽的.只设这一行也不起作用.但是在实际应用中总是等宽处理,并不按照样式来走. XML/HTML代码 < ...
- 多重盒子嵌套下,子盒子撑开父盒子,父盒子宽度随子盒子内容自适应
先看默认状态下的效果: 块级元素高度被内容撑开,宽度默认为父级100%(这里父级为浏览器大小) 行内元素的宽高都由内容撑开 我们的需求是:让块级父盒子的宽度由子盒子撑开 结论:把需要自适应的那层父盒子 ...
- [JS]div根据其中内容自适应宽度和高度
这里以自适应高度为例.先要设定好div的width,不用设置div的height属性.后面只需设置minHeight属性或者干脆minHeight属性也不去设置,再保证div是块级元素或绝对/固定位置 ...
最新文章
- 十分钟上手2022latex安装与入门
- 西北AI现在什么水平?有人3年即实现盈利,如今估值7亿!西工大系CEO:现实没那么高大上...
- 在LoadRunner脚本中处理HTTP重定向
- 【实施工程师】Linux安装Windows软件:微信、QQ、TIM
- AT3945-[ARC092D]Two Faced Edges【dfs】
- 图解HashMap和HashSet的内部工作机制
- [渝粤教育] 中国人民解放军陆军工程大学 机械基础 参考 资料
- ES2015 中的函数式Mixin
- 传说之下地图素材_【开阔眼界】地图上的史记——名著轻松读
- Linux 查看进程的命令
- Linux 安装 Pycharm
- VMware下Ubuntu图形界面切换到命令行终端模式
- 开始新的学习之旅--PHP开发学习--基础部分笔记
- C# 结构体转byte数组 结构体转byte[] 结构体、byte数组互转
- 思科路由器OSPF配置实例
- 通信接口五种主要的类型是什么?RS-232、485、CAN、USB
- 高级查询组件下拉框联动(三)
- 我们该如何全面提高程序的可读性
- Emlog程序CYP音乐主题模板源码
- c# wifi串口通信_C#中的串口通信