CSS 控制显示的行数

 

文本一行显示，超出省略号展示

                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;

 

显示固定行数

overflow: hidden;

 display: -webkit-box;

-webkit-box-orient: vertical;

 -webkit-line-clamp: 4;

display: -webkit-box：将标签元素设置为一个弹性伸缩的盒子模型来展示

text-overflow: ellipsis; 设置排列方式为垂直方向

-webkit-line-clamp：4 控制显示的行数为4行