分析设计稿和创建DOM

一、设计资源管理

1)加载设计稿

1)拖拽设计稿到工作区 -> 2)选择几倍图 -> 3)从相关的页面找到目标画板 -> 4)隐藏不需要的选择窗口

2)清理设计稿

设计稿加载后，AD会缓存相关资源。点击 文件->open recent-> clear menu 可以清理缓存

二、构建Dom

1)创建component

component是构建页面的基本单位，创建dom前需要先生成一个component，点击+号创建component

（鼠标双击或Enter键可修改组件名称）

2)创建列

1. 创建一个空列，并向其中添加元素

(不选择任何图层时点击 C button会创建一个空的div col)

2. 选定图层创建成列，并向其中添加元素

3. 框选一组图层建成列（AD自动判断图层的嵌套关系）

注意1：AD可以创建出正确嵌套的行或列，但这组选中的图层不能同时包含行和列，否则会创建错误的DOM结构。工程师要确保一组选中的图层要么是列要么是行，不能同时包含

技巧：DOM结构在AD中用树状控件来表示，适当折叠关键节点可以让整个DOM结构看起来更清晰