scss循环

// 定义flex等分
@for $i from 0 through 12 {
	.f-#{$i} {
		flex: $i;
	}
}

//定义zindex层级
@for $i from 0 through 1000 {
	.zi-#{$i} {
		z-index: $i;
	}
	
}
// 定义字体(rpx)单位，10~100rpx  fs-10 ~ fs-100
@for $i from 10 through 100 {
	.fs-#{$i} {
		font-size: $i + rpx;
	}
}
// 定义内外边距，历遍0-500
@for $i from 0 through 500 {
	//m-all-30
	.m-all-#{$i} {
		margin: $i + rpx;
	}
	//p-all-30
	.p-all-#{$i} {
		padding: $i + rpx;
	}
	@each $short, $long in l left, t top, r right, b bottom {
		// 缩写版，结果如： ml-1 mr-10 mb-100 mt-135
		// 定义外边距
			.m#{$short}-#{$i} {
				margin-#{$long}: $i + rpx;
			}
		// 定义内边距，结果如：pl-30 pr-30 pb-30 pt-30
			.p#{$short}-#{$i} {
				padding-#{$long}: $i + rpx;
			}
		}
}
//全局宽高
@for $i from 0 through 750 {
	// w-0 ~ w-750
	.w-#{$i} {
		width: $i + rpx;
		max-width: $i + rpx;
		min-width: $i + rpx;
	}
	// h-0 ~ h-750
	.h-#{$i} {
		height: $i + rpx;
		max-height: $i + rpx;
		min-height: $i + rpx;
	}
	// lh-0 ~ lh-750
	.lh-#{$i} {
		line-height: $i + rpx;
	}
}

//全局圆角 行高 br-0 ~ br-100
@for $i from 0 through 100 {
	// w-0 ~ w-750
	.br-#{$i} {
		border-radius: $i + rpx;
	}
	// h-0 ~ h-750
}