//sass常用混合器(应该合理使用)
// 弹性布局混合器
@mixin flexMixer($justify: center, $align: center, $flex: row) {
	// 申明为弹性盒子
	display: flex;
	// 排列方式
	flex-direction: $flex;
	// 主（副）轴的对齐方式
	justify-content: $justify;
	// 主（副）轴的对齐方式
	align-items: $align;
}
// 定位混合器
@mixin positionMixer($position: static, $left: auto, $top: auto, $right: auto, $bottom: auto) {
	position: $position;
	left: $left;
	top: $top;
	right: $right;
	bottom: $bottom;
}
// 浮动混合器
@mixin floatMixer($float: left) {
	float: $float;
}
// 设置背景混合器
@mixin bgMixer($url, $position: center center, $size: 100% 100%, $repeat: no-repeat) {
	background: $url $repeat $position;
	background-size: $size;
}
// 宽高混合器
@mixin widthMixer($width: 100px, $height: 100px) {
	width: $width;
	height: $height;
}

// 文字混合器
@mixin fontMixer($fontSize: 16px, $color: #515a6e, $weight: 500, $font-familyt: Source Han Sans SC) {
	font-family: $font-familyt;
	font-size: $fontSize;
	font-weight: $weight;
	color: $color;
}

// 多行字体省略混合器
@mixin pointMixer($line: 2) {
	display: -webkit-box; //必须结合的属性 ，将对象作为弹性伸缩盒子模型显示 。
	word-break: break-all;
	-webkit-line-clamp: $line;
	line-clamp: $line;
	overflow: hidden;
	text-overflow: ellipsis; //可以用来多行文本的情况下，用省略号“…”隐藏超出范围的文本 。
	white-space: normal;
	/* autoprefixer: off */
	-webkit-box-orient: vertical; //必须结合的属性 ，设置或检索伸缩盒对象的子元素的排列方式 。
	/* autoprefixer: on */
}

// 隐藏滚动条
@mixin hiddenScroll() {
	/* Firefox */
	scrollbar-width: none;
	/* Chrome Safari */
	&::-webkit-scrollbar {
		display: none;
	}
}