引导模式中的文本溢出省略号

Posted 2021-03-27

我想要获得的是Bootstrap模态体中非常长的文本内容，它放在一条线上，如果长于模态宽度则以省略号结束。

<div class="modal-body">
    <span>Some very very very long text in the modal.</span>
</div>

答案

尝试：

CSS

.ellipsis {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

html

<div class="modal-body">
  <div class="ellipsis">Some very very very long text in the modal.Some very very very long text in the modal.Some very very very long text in the modal.Some very very very long text in the modal.</div>
</div>

但是：ぁzxswい

另一答案

对于bootstrap 4，现在有http://jsfiddle.net/lotusgodkk/GCu2D/2084/类也会这样做。

text-truncate