css - 如何在具有 :after 伪元素的链接中使用省略号

Question

我有一个链接，如下图所示

我想做的是申请

text-overflow: ellipsis; 

所以在这种情况下，“Page”这个词将被省略号替换，但仍然有箭头，它是链接的一个 :after 元素。

链接代码是这样的：

.next-lesson:after{
background: url("img/icons.png") no-repeat -9px -91px;
display: inline-block;
background-repeat: no-repeat;
width: 15px;
height: 15px;
content: "";
margin-left: 5px;
}

Answer 1

关于您的最后一条评论，您可以执行以下操作：

position:relative在链接的父 div 和position:absolute链接的伪元素上声明，使其独立于及其a声明的overflow:hidden. 相应地调整位置，一切都应该没问题。