通常使用 ellipsis 将溢出部分显示为省略号必须给出指定像素宽度(width:200px),这样不方便共享响应式的样式定义,经过查资料,可以用 CSS 的 calc() 函数实现。
- table > tbody > tr > td.file > a {
- display: inline-block;
- height: 45px;
- padding-left: 46px;
- background-repeat: no-repeat;
- margin-top: 10px;
- margin-bottom: 10px;
- width: calc(50%);
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- }