You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
1.1 KiB
48 lines
1.1 KiB
@use 'sass:math'; |
|
|
|
// 命名空间 |
|
$namespace: v; |
|
// el命名空间 |
|
$elNamespace: el; |
|
$W-scale-ratio-1440: math.div(1440, 1920); |
|
$H-scale-ratio-900: math.div(900, 1080); |
|
|
|
$W-scale-ratio-2560: math.div(2560, 1920); |
|
$H-scale-ratio-1440: math.div(1440, 1080); |
|
|
|
@mixin ResponsiveW($base-width) { |
|
width: $base-width + px; |
|
|
|
@media only screen and (max-width: 1440px) { |
|
width: calc($W-scale-ratio-1440 * #{$base-width}px); |
|
} |
|
|
|
@media only screen and (min-width: 2560px) { |
|
width: calc($W-scale-ratio-2560 * #{$base-width}px); |
|
} |
|
} |
|
|
|
@mixin ResponsiveH($base-height) { |
|
height: $base-height + px; |
|
|
|
@media only screen and (max-width: 1440px) { |
|
height: calc($H-scale-ratio-900 * #{$base-height}px); |
|
} |
|
|
|
@media only screen and (min-width: 2560px) { |
|
height: calc($H-scale-ratio-1440 * #{$base-height}px); |
|
} |
|
} |
|
|
|
@mixin ResponsiveFz($base-font-size) { |
|
font-size: $base-font-size + px; |
|
|
|
@media only screen and (max-width: 1440px) { |
|
font-size: calc($W-scale-ratio-1440 * #{$base-font-size}px); |
|
} |
|
|
|
@media only screen and (min-width: 2560px) { |
|
font-size: calc($W-scale-ratio-2560 * #{$base-font-size}px); |
|
} |
|
} |
|
|
|
|