限制跨度中显示的字符 [英] Limit characters displayed in span

问题描述

在HTML或CSS中是否有某种方式来限制用跨度显示的字符？我使用显示这些信息框的中继器，并且我想将字符限制为前20个字符，并且如果输入内容更多，那么只需连接？该框如图所示：

< img src =https://i.stack.imgur.com/9rSDI.pngalt =在这里输入图片描述>

我的代码因为这是：

 < span class =ClaimsRightmaxlength =20> {{item.provider}} < /跨度> 
  

解决方案

下面是一个使用文本溢出的例子： p>

  .text {display：block;宽度：100px;溢出：隐藏;白色空间：nowrap; text-overflow：ellipsis;}  

< span class = text> Hello world this is a long sentence< / span>

Is there some sort of way within HTML or CSS to limit the characters displayed with a span? I use a repeater that displays these info boxes and I want to limit the characters to the first 20 characters and if the input has more, then just concatenate? The box is like image shown:

My code for this is:

<span class="claimedRight" maxlength="20">{{ item.provider }}</span>

解决方案

Here's an example of using text-overflow:

.text {
  display: block;
  width: 100px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

<span class="text">Hello world this is a long sentence</span>

这篇关于限制跨度中显示的字符的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！