scss定义公共css

// margin、padding、font-size、line-height 1-100的值，用法 class="mt-20"
@for $i from 1 through 100 {
	// margin
    .mt-#{$i} {
      margin-top: $i * 1rpx;
  	}
	.mb-#{$i} {
	  margin-bottom: $i * 1rpx;
	}
	.ml-#{$i} {
	  margin-left: $i * 1rpx;
	}
	.mr-#{$i} {
	  margin-right: $i * 1rpx;
	}
	.mtb-#{$i} {
	  margin: $i * 1rpx 0;
	}
	.mlr-#{$i} {
	  margin: 0 $i * 1rpx;
	}
	.m-#{$i} {
	  margin: $i * 1rpx;
	}
	
	// padding
	.pt-#{$i} {
	  padding-top: $i * 1rpx;
	}
	.pb-#{$i} {
	  padding-bottom: $i * 1rpx;
	}
	.pl-#{$i} {
	  padding-left: $i * 1rpx;
	}
	.pr-#{$i} {
	  padding-right: $i * 1rpx;
	}
	.ptb-#{$i} {
	  padding: $i * 1rpx 0;
	}
	.plr-#{$i} {
	  padding: 0 $i * 1rpx;
	}
	.p-#{$i} {
	  padding: $i * 1rpx;
	}
	
	// font-size
	.f-#{$i} {
	  font-size: $i * 1rpx;
	}
	
	// line-height
	.lin-#{$i} {
	  line-height: $i * 1rpx;
	}
}

/* 弹性布局 */
.flex{
	display: flex;
}
.a-c{
	align-items: center;
}
.a-s{
	align-items: flex-start;
}
.a-e{
	align-items: flex-end;
}
.j-c{
	justify-content: center;
}
.j-sb{
	justify-content: space-between;
}
.j-s{
	justify-content: flex-start;
}
.j-e{
	justify-content: flex-end;
}
.j-sa{
	justify-content: space-around;
}
.f-w {
  flex-wrap: wrap;
}
.f-1 {
  flex: 1;
}

/* 文本对齐 */
.t-c{
	text-align: center;
}
.t-l{
	text-align: left;
}
.t-r{
	text-align: right;
}

/* 文本超出省略号 */
.o-1{
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.o-2{
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
	overflow:hidden;
}
.o-3{
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:3;
	overflow:hidden;
}

/* 文字效果 - 加粗 */
.bold{
	font-weight: bold;
}
/* 文字效果 - 下划线 */
.text-u{
	text-decoration: underline;
}
/* 文字效果 - 删除线 */
.text-l{
	text-decoration: line-through;
}