智能的响应适配方案
MooKwai 提供了一套独创的自动响应适配方案,使用更少的时间完成更好的适配。在 MooKwai 中设置的全局样式均以视窗宽度为 1440px 作为标准,其他大于或小于1440尺寸的均以一定的比例公式进行转换。因此在设计桌面端界面时建议使用 1440px 的尺寸进行设计。
断点规则
设备 | 视窗宽度 | 视窗比例 | 名称 | 间距适配规则 |
---|
桌面端 | 1440px | 横 | 标准尺寸 | a |
桌面端 | 1201 – 1600px | 横 | 常规 | a / 1440 * 100vw |
桌面端 | 1601 – 1800px | 横 | 大屏(lg) | a * 1600 / 1440px |
桌面端 | 1801 – 2200px | 横 | 大屏(xl) | a * 1600 / 1440px |
桌面端 | 2201px 及以上 | 横 | 大屏(xxl) | a * 1600 / 1440px |
桌面端 | 901 – 1200px | 竖 | 竖版 | a / 1440 * 100vw |
平板电脑 | 901 – 1200px | 横 | 平板电脑 | a / 1440 * 100vw |
平板电脑 | 601 – 900 px | 竖 | 平板电脑(竖版) | a * 812 / 1440px |
移动端 | 900px 及以下 | 横 | 移动端 | a * 812 / 1440px |
移动端 | 600px 及以下 | 横 + 竖 | 移动端(竖版) | a * 812 / 1440px |
* a 为标准尺寸下全局样式中设置的数值