用sass大屏css样式设置vh vw

设置vh vw需要配置的值

文件位置@/assets/styles/util.scss

@use "sass:math";
// 默认设计稿的宽度

// $designWidth: 1920;
// // 默认设计稿的高度
// $designHeight: 1080;

$designWidth: 7680;
// 默认设计稿的高度
$designHeight: 2160;
// px 转为 vw 的函数


@function vw($px) {
  @return math.div($px, $designWidth) * 100vw;
}

// px 转为 vh 的函数
@function vh($px) {
  @return math.div($px, $designHeight) * 100vh;
}


//高度换算为宽度单位
@function top($top){
  @return math.div($designHeight, $designWidth) * math.div($top, $designHeight) * 100vw;
}