Merge branch 'main' of http://10.1.1.5:8418/acdiu/AcdiuTools
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
// ========================================================
|
||||
// 1. 变量与断点定义 (集中管理)
|
||||
// ========================================================
|
||||
$breakpoints: ( 'mobile': 768px, 'tablet': 1024px, 'desktop': 1920px, '4k': 3840px );
|
||||
$breakpoints: ( 'mobile': 768px, 'tablet': 1024px, 'desktop': 1920px, '2k': 2560px, '4k-40': 3800px, '4k': 3840px );
|
||||
|
||||
// 字号常量
|
||||
$font-size-small: 14px; // 手机/平板基准
|
||||
@@ -49,6 +49,7 @@ $container-paddings: 1rem;
|
||||
}
|
||||
|
||||
/* --- 全局布局容器适配 --- */
|
||||
// 其中 4k-40 为准 4K, 以适配 PC 端部分浏览器最大化时边框占位从而影响到 4K 宽度判定
|
||||
.container {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
@@ -66,7 +67,15 @@ $container-paddings: 1rem;
|
||||
@include respond-to('desktop') {
|
||||
max-width: 1800px;
|
||||
}
|
||||
// 4K 以上容器随之线性扩大
|
||||
|
||||
@include respond-to('2k') {
|
||||
max-width: 2560px;
|
||||
}
|
||||
|
||||
@include respond-to('4k-40') {
|
||||
max-width: 3800px;
|
||||
}
|
||||
// 当容器等于 4K 时,随之线性扩大
|
||||
@include respond-to('4k') {
|
||||
// 保持容器宽度占比:(3600 / 3840) * 100vw = 93.75vw
|
||||
max-width: 93.75vw;
|
||||
|
||||
Reference in New Issue
Block a user