ImgCook实现页面弹性布局_imgcook布局

                                                                                             IMGCOOK调整页面文档

1. 上传文件（.sketch/.psd/.jpg/.png）以.Sketch文件为例

1. 选择点击导出
2. 编辑器介绍
3. 
4. 页面组件调整
5.      1.删除组件
6. 
7. 添加组件
8. 
9. 修改组件属性（重点）
10.                       （1）自适应  布局模式选择弹性布局
11. 
12. 让页面在画布中置顶   去除margin-to-顶部外边距(设置为0)
13. 
14. 设置画布尺寸宽度为100%  高度为100%
15. 
16. 应用设置 设计稿宽度和布局视口宽度  都为100%
17. 

18. 设置 div宽度（点开div宽无数值   则可改可不改）修改只针对div组件

19. 

20. 全部改完  根据自己对页面的需求再调整css属性
21. 
22. 保存-->点击代码 -->选择H5开发新规范(动态)
23. 

24. 保存并导出   让我们来看一下效果

25. 

26. 发现有白边空隙(这是由于默认css导致)

    解决方案

    打开style.css文件   在首行加入

    * {

    padding: 0;

    margin: 0;

    }  

    即可解决问题（PC端口）

27. 

28. (移动端)

29.