宽度溢出/行数溢出显示点点点点

2020-11-09  本文已影响0人  每天进步一点点5454

宽度


text-overflow: ellipsis;/*只是起到注解作用*/
white-space: nowrap;/*不让文本换行*/
overflow: hidden;/*超出的部分显示...*/

行数

// 单行省略:
    width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    
//    多行后省略的情况:
    width:100% ;
    overflow : hidden;//超出的部分隐藏
    text-overflow: ellipsis;//超出的部分省略
    display: -webkit-box;//设置为是一个盒子
    -webkit-line-clamp: 2;//超出几行后会开始隐藏
    -webkit-box-orient: vertical;//子元素的排列顺序

 width:100%;
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
padding-left: 75px;
background: linear-gradient(to right,transparent, #fff 55%);
color: #333333;
上一篇 下一篇

猜你喜欢

热点阅读