文字右对齐。向左排表。超过容器时省略
在这种情况下,就有一个非常陌生的属性派上了用场。就是 :
direction: rtl
这个属性规定文本的方向 / 书写方向是从右到左的。
a {
display:inline-block;
width:100%;
white-space:nowrap;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
overflow: hidden;
direction: rtl;
}
然后我们再加上超过容器省略文字:
a {
display:inline-block;
width:100%;
white-space:nowrap;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
overflow: hidden;
-webkit-line-clamp: 1; //在第几行后开始省略
direction: rtl;
}
最终效果便如下图所示。