适配

• 绿色区域为iframe嵌套区，最小宽度为900像素，最大可根据分辨率自适应居中显示，底部预设一张白色背景（#FFFFFF)，适配与iframe相同

• 蓝色区域为固定间距，两侧各60像素，预设灰色背景(#F6F8FA)

• 红色区域为浏览器滚动条预留区域，iframe区域、灰色间距区域、滚动条区域、侧边栏区域相加最小适配尺寸为1280像素（900+60×2+40+220=1280px)

标准分辨率适配效果(1920px*1080px)

最低分辨率适配效果(1280px*720px)

iframe嵌套显示效果

接入方式

• 绿色区域为接入页面区域，原页面需左右居中对齐，接入页面不可使用左对齐或右对齐适配

• 蓝色区域为原页面背景区域，接入页面建议去除背景

• 若原页面有菜单栏则接入页面去除顶部菜单栏

• 若原页面嵌套区域与顶部存在固定的间距，则接入页面去掉间隔，内容对齐画面顶部

• 若原页面嵌套区域的外框存在卡片式、阴影、圆角等样式，则接入页面增加判断建议去除此类样式，原页面可保留样式

• 建议原页面宽度实现自适应适配，若无法实现，则宽度固定为900像素

应用方原页面适配效果

应用方原页面显示效果

接入页面建议效果（白色区域嵌套）

下载

个人空间适配规范.sketch