将图片或div设置圆角
/*设置圆角15为圆角大小，设50%时可以变成圆⚪*/
border-radius: 15px;
背景图片设置
/*第一个参数是图片地址，第二个为图片显示方式（no-repeat：平铺不重复），显示位置居中*/
background: url(../images/daohang.png) no-repeat center;
/*第一个参数是图片地址，第二个为图片显示方式（no-repeat：平铺不重复），显示位置（x轴位置，y轴位置）可以百分比也可以像素*/
background: url(../images/daohang.png) no-repeat 50px 30px;
background: url(../images/daohang.png) no-repeat 50% 30%;
/*背景图片大小*/
background-size: 100% 100%;
超出一行变成省略号
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
//控制行数
-webkit-line-clamp:1;
-webkit-box-orient:vertical;
使用伪类设置下划线
.classify-title {
position: relative;
width: 100%;
height: 30px;
line-height: 25px;
font-weight: 600;
font-size: 16px;
}
.classify-title:before {
content: '';
position: absolute;
left: 0;
top: auto;
bottom: 1px;
right: 0;
height: 5px;
width: 30px;
background-color: #f39c81;
}
图片水平居中垂直居中
.graphic-module_image-module {
display: -webkit-box;
-webkit-box-align: center;
-webkit-box-pack: center;
}
.graphic-module_image-module image {
width: 60px;
height: 60px;
}
display: flex;超出自动换行
.icon-choose {
display: flex;
width: 100%;
height: auto;
flex-wrap: wrap;
}
.icon-choose_bn-module {
padding: 5px 0;
width: 25%;
text-align: center;
}
div 自动换行
word-break: break-all;
text-indent抬头距离，letter-spacing字与字间距。
//两个字体的缩进
text-indent:2em;
//20px的缩进
text-indent:20px;
文字阴影
text-shadow:5px 5px 5px
