前端进行简单的大屏适配

公共 style 文件下创建 Common.sass 文件进行配置

@use "sass:math";
//根据页面宽度做适配
@function vw($px) {
 @return (math.div(100,1920)) * $px + vw;
}

//根据页面高度做适配
@function vh($px) {
@return (math.div(100,1080)) * $px + vh;
}

//设置字体及颜色
@mixin font($family,$size,$color:#FFF) {
color: $color;
font: {
  family: $family;
  size: vw($size);
};
}

在外部 sass 文件进行调用

@import "src/Style/Common";


width: vw(100)
height: vh(100)