Question

我在div的末尾添加3个点有问题。我的文字太长了，没有;没有足够的空间可以显示，在div上我想要显示3个点。

我知道文本溢出省略号，但现在在IE和Firefox上工作正确。

是否可以通过其他方式进行。

我想在CSS中创建轻松，但不知道如何没有省略号。

HTML

<div>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
        consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
        cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
        proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

CSS

 div{
  height:38px !important;
  overflow: hidden;
 }

Answer 1

<script>
    $(document).ready(function () {
        $('.dropdown-toggle').dropdown();
    });
</script>

div {
  max-width:100%;
  height:38px;
  overflow: hidden;
  position: relative;
  line-height: 1em;
  max-height: 3em;
  text-align: justify;
  padding-right: 1em;
  font-size: 20px;
}
div:before {
  content: '...';
  position: absolute;
  right: 2px;
  bottom: 0px;
}

Answer 2

检查我在类似问题上的答案，为多行文字添加点Add dots to the multi line text它可能对您有所帮助

Answer 3

我知道你要求CSS，但是你可能（或者未来的读者可能）不想要CSS：当窗口大小改变时它不会更新，它不是一个非常好的，也不是灵活的，也不是简单的方法。有＆＃34; ...＆＃34;，我遇到了同样的问题，我试图用CSS修复，最后我使用了一个名为dotdotdot的JS库。

PS：请不要因为它不符合所有条件而不喜欢，我有完全相同的问题，我知道CSS不一定是最好的选择（对于用户体验和开发人员）所以它＆重要的是你知道你拥有的所有选择。

Css最后添加3个点

3 个答案: