参考stackoverfolow
想要给元素添加text-overflow: ellipsis;样式,必须保证改其父元素是块级元素,如果其是行级元素,可以通过设置display:block;或者display:inline-block;属性


<html>
    <body>
        <style>
            .container {
              width: 120px;
            }

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

            .color {
              color: black;
            }

        </style>
        <div class="container">
            <div class="text">
                <span class="color">Lorem</span> ipsum dolor sit amet, consetetur
            </div>
        </div>
    </body>
</html>

另参考IE8/9:省略号 ellipsis 之怪现象

相关文章:

  • 2021-08-27
  • 2022-12-23
  • 2021-08-01
  • 2021-08-24
  • 2021-11-05
  • 2022-01-28
猜你喜欢
  • 2022-12-23
  • 2021-10-16
  • 2022-12-23
  • 2021-07-14
  • 2022-03-04
相关资源
相似解决方案