javascript – 如何在换行时隐藏分隔符？

我认为用一个例子来解释这是最容易的.

假设我在这样的网页上有一个列表：

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; }
}

原文地址：https://www.jb51.cc/css/427390.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。