$rem-baseline: 16px !default; // rem 默认基准
$scaleWidth: 1920px !default; // UI 设计基准宽度
$scaleHeight: 1080px !default; // UI 设计基准高度
html {
font-size: $rem-baseline;
@media only screen and (max-width: 1600px) and (min-width: 1441px) {
font-size: 14px;
}
@media only screen and (max-width: 1441px) and (min-width: 1371px) {
font-size: 12px;
}
@media only screen and (max-width: 1371px) {
font-size: 10px;
}
}
// rem 函数
@function rem($px) {
@return $px / $rem-baseline * 1rem;
}
// UI 按照百分比缩放
@function VW($px) {
@return $px / $scaleWidth * 100vw;
}
@function VH($px) {
@return $px / $scaleHeight * 100vh;
}