word-wrap&&word-break,奇偶行、列设置样式
1、word-wrap和word-break区分。
来源场景:机械租赁mvc驾驶员信息查看:
当备注的文字多的时候,第一列的值成这模样:
解决方案:设置table 的td可自动换行。首先table设置固定样式:table-layout:fixed
再把td样式改成: td {
word-wrap: break-word;
}。
2、奇偶行、列设置样式。
来源场景:设置好换行后,可第一列太宽,用内联样式设置td宽度也不管用,如下图所示:
解决方案:最后原因是:在table标签里竟然设置了table的宽度。可能是自适应整个表的列行、默认列的宽度加大了。去掉table的宽度后,我们设置下你需要的td列的宽度即可。我需要的是每行的奇数列设置下宽度。奇数列,用伪选择器:
table td:nth-child(2n+1) {
width: 70px;
}
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步