HTML，CSS箭头，单多行文本省略

箭头

//HTML
 <div class="arrows-right"></div>
 //CSS
.arrows-right {
    position: relative;
}
.arrows-right::before {
    position: absolute;
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    border-top: 1px solid #999999;
    border-right: 1px solid #999999;
    background-color: transparent; /* 模块背景为透明 */
    /*箭头方向可以自由切换角度*/
    transform: rotate(135deg);
} 

单多行文本省略

//CSS
/* 多行文本省略 默认2行*/
.vertical {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
/* 单行 文本省略*/
.nowrap {
    white-space: nowrap;
    overflow: hidden;
    /* //文本超出省略号替代 */
    text-overflow: ellipsis;
}