响应式布局确保页面在不同屏幕尺寸下都能获得良好的显示效果。
响应式断点
编辑器支持以下设备尺寸的预览与适配:
- 桌面端:≥ 1200px
- 平板端:768px - 1199px
- 手机端:< 768px
响应式设置
断点特定样式
每个容器和部件都支持为不同断点单独设置样式,包括:
- 显示/隐藏
- 宽度与高度
- 内边距与外边距
- 排列方向
- 字体大小
使用建议
- 优先设计桌面端布局,再逐级向下适配
- 在手机端可考虑隐藏部分非关键内容
- 使用弹性布局让容器自动适应屏幕宽度
- 注意图片等媒体资源在移动端的缩放
通过顶部工具栏的响应式切换按钮,可实时预览不同设备下的页面效果。