CSS中让文字溢出显示省略号

第一种方法

  display: -webkit-box;

  text-overflow: ellipsis;

  -webkit-line-clamp: 2;

  -webkit-box-orient: vertical;

  overflow: hidden;

第二种方法

  word-break:break-all;

  display:-webkit-box;

  -webkit-line-clamp:2;

  -webkit-box-orient:vertical;

  overflow:hidden; 

第三种方法:(适用于uniApp开发)

                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;  //使用自适应布局
                -webkit-line-clamp: 2;  //设置超出行数,要设置超出几行显示省略号就把这里改成几
                -webkit-box-orient: vertical;    

你可能感兴趣的:(css,javascript,前端)