less&scsscommonmixin&functioncollectionscssmixin:returnstylecollectiondefinition:@mixinvariablename(parameter){style}call:@include变量名(parameter);mixin基本用法//单行文本溢出@mixinoneRowOverflow{white-space:nowrap;溢出：隐藏；text-overflow:ellipsis;}mixinpassparameters//多行文本溢出@mixinmultipleRowsOverflow($width,$row){width:$width;显示：-webkit-box；溢出：隐藏；-webkit-box-orient：垂直；分词：break-all；文本溢出：省略号；-webkit-line-clamp:$row;}mixin参数默认值//多行文本溢出@mixinmultipleRowsOverflow($width:100%,$row:2){width:$width;显示：-webkit-box；溢出：隐藏；-webkit-box-orient：垂直；分词：break-all；文本溢出：省略号；clamp:$row;}mixin+condition//弹性框布局@mixinflexLayout($justify:null,$align:null,$direction:null){display:flex;@if$direction!=null{flex-direction:$direction;}@if$justify!=null{justify-content:$justify;}@if$align!=null{对齐项：$align；}}mixin+while循环//批处理fontsize@mixinfontSizeLoop($base:10,$increment:2,$max:52,$unit:1px){@while$base<=$max{.fz-#{$base+$increment}{字体大小:($base+$增量）*$单位；}$基数：$基数+$增量；}}Mixin在mixin//Centerimage内部被调用@mixinimgLayout($width:null){@if$width!=null{@ifnotunitless($width){width:px2rem($width);}@else{宽度：$宽度；}}@includeflexLayout(center,center);溢出：隐藏；img{字体大小：px2rem(12);宽度：100%；object-fit:fill}}function:用来处理参数最后返回一个具体的值定义：@function变量名(参数){return返回值}call:变量名(参数);函数传递参数@functionstripUnits($target){@returnmath.div($target,$target*0+1);}function+condition@use'sass:math';@functionpx2rem($px,$context:$root-font-size){@ifnotunitless($px){$px:stripUnits($px);}@ifnotunitless($context){$context:stripUnits($context)}@return$px/$context*1rem;}less
