前端css常遇到问题

APP条件编译

css

/* #ifdef H5 */
top: 350rpx;
/* #endif */
/* #ifdef APP-PLUS */
top: 378rpx;
/* #endif */

js

// #ifdef  APP-PLUS || H5
arr.push('1)
// #endif

设置下划线

text-decoration: underline;

原生表格去掉边框

border-collapse: collapse;

3个一列样式

/deep/.zhtx-single:nth-child(3n-2){

    margin-left: 0;

}

字间距

letter-spacing:8px;

超出隐藏2种办法

overflow: hidden;
word-break: break-all;  
text-overflow: ellipsis; 
display: -webkit-box; 
-webkit-box-orient: vertical; 
-webkit-line-clamp: 1; 

width: 100px;
overflow: hidden;
text-overflow: ellipsis; 
white-space: nowrap;  
word-wrap: break-word; 

中文和数字不并排展示问题

display: -webkit-box;
word-break: break-all;
word-wrap: break-word;
overflow: hidden 
text-align: left;  

加阴影

box-shadow: 0rpx 3rpx 20rpx 0rpx rgba(0, 0, 0, 0.1);

渐变背景

background: linear-gradient(90deg, #1FAFE7 0%, #6347E0 100%);