我认为用一个例子来解释这是最容易的.
假设我在这样的网页上有一个列表：
word one,word two,word three,word four,word five,word six
如果用户的屏幕分辨率较小,列表最终可能会像这样包装：
word one,word six
如您所见,第一行末尾有一个逗号.我想改变它,所以如果发生这样的事情,隐藏逗号.这意味着它看起来像这样：
word one,word five
word six
有没有办法用CSS或Javascript做到这一点？
谢谢你的帮助.
最佳答案
是.只是让它们溢出负边距,并隐藏溢出.
div {
border: 1px solid;
overflow: hidden;
animation: size 5s linear infinite alternate;
}
span {
display: inline-block;
margin-right: 10px;
}
span::before {
content: ',';
display: inline-block;
width: 10px;
margin-left: -10px;
}
@keyframes size {
from { width: 750px; }
to { width: 0; }
}