[CSS] Record some css usage

rapid jitter

@keyframes shake {
    
     
    10%, 90% {
    
     
        transform: translate3d(-1px, 0, 0); 
    }
    20%, 80% {
    
     
        transform: translate3d(2px, 0, 0); 
    }
    30%, 50%, 70% {
    
     
        transform: translate3d(-4px, 0, 0); 
    }
    40%, 60% {
    
     
        transform: translate3d(4px, 0, 0); 
    }
}
.apply-shake {
    
    
    animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}

<el-input v-model="shakeInput" :class="{'apply-shake': isShake}" style="width: 200px"></el-input> 
<el-button @click="onShakeSumbit" type="primary">确定</el-button>

onShakeSumbit(){
    
    
    if(this.shakeInput == ""){
    
    
        // 动态抖动
        this.isShake = true
        setTimeout(()=>{
    
    
            this.isShake = false
        }, 820)
        return; 
    }
}

Omit more than one line

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

Omit if it exceeds two lines (more than two lines)

// 超出两行省略
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box; 
-webkit-box-orient:vertical;
// 超出行数
-webkit-line-clamp:2;