23 lines
570 B
SCSS
23 lines
570 B
SCSS
|
// 屏幕适配工具
|
|||
|
|
// 设计稿基准：1920px (宽) × 982px (高，不含头部)
|
|||
|
|
|
|||
|
|
// 将 px 转换为 vw (基于设计稿宽度 1920px)
|
|||
|
|
@function vw($px) {
|
|||
|
|
@return calc($px / 1920 * 100vw);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 将 px 转换为 vh (基于设计稿内容区域高度 982px)
|
|||
|
|
@function vh($px) {
|
|||
|
|
@return calc($px / 982 * 100vh);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 字体大小转换 (使用 vw 确保响应式)
|
|||
|
|
@function fs($px) {
|
|||
|
|
@return calc($px / 1920 * 100vw);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 使用示例：
|
|||
|
|
// width: vw(580); // 580px → vw
|
|||
|
|
// height: vh(400); // 400px → vh
|
|||
|
|
// font-size: fs(16); // 16px → vw
|