文本缩略 文本超出显示省略号 控制超出省略的行数

文本缩略


.abb{
    
    
	//超出一行省略
	overflow:hidden; 
	white-space:nowrap; 
	text-overflow:ellipsis;
}

超出2行省略

.abb2{
    
    
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  //超出2行省略
  -webkit-line-clamp:2;
  overflow: hidden;
}

控制超出省略的行数

.txt-over{
    
    
	/*控制超出省略的行数*/
	word-break: break-all;
    text-overflow: ellipsis;
    display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
    -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
    -webkit-line-clamp: 2; /** 显示的行数 **/
    overflow: hidden;
}

猜你喜欢

转载自blog.csdn.net/maoge_666/article/details/131917259