section 2.3 专题课堂——可视化助理

导读

可视化助理包括使用标尺、设置网格等，可以更加准确地制作出精美的网页。本节将详细介绍使用可视化助理方面的知识。

2.3.1 使用标尺

微课堂 00分36秒

使用标尺可以更精确地计算所编辑网页的宽度和高度，使网页更符合浏览器的显示要求。下面详细介绍使用标尺的操作方法。

操作步骤 >> Step by Step

第1步 启动Dreamweaver CC程序，1．单击【查看】主菜单，2．在弹出的菜单中选择【标尺】菜单项，3．在弹出的子菜单中选择【显示】菜单项，如图2-12所示。

第2步 通过以上步骤即可完成在Dreamweaver CC中显示标尺的操作，如图2-13所示。

专家解读

如果要更改标尺的度量单位，可以单击【查看】主菜单，在弹出的菜单中选择【标尺】菜单项，在弹出的子菜单中包括【像素】菜单项、【英寸】菜单项和【厘米】菜单项，用户可以根据需要来进行选择。

2.3.2 设置网格

微课堂 00分23秒

在Dreamweaver CC的设计视图中，网格是对Div进行绘制、定位或大小调整的可视化向导。

利用Dreamweaver中的网格功能，可以使页面元素在被移动后自动靠齐到网格，并通过指定网格设置来更改网格或控制靠齐行为。下面详细介绍在Dreamweaver CC中设置网格的操作方法。

操作步骤 >> Step by Step

第1步 启动Dreamweaver CC程序，1．单击【查看】主菜单，2．在弹出的菜单中选择【网格设置】菜单项，3．在弹出的子菜单中选择【显示网格】菜单项，如图2-14所示。

第2步 通过以上步骤即可完成在Dreamweaver CC中显示网格的操作，如图2-15所示。

第3步 若要设置网格的颜色、间隔等，1．单击【查看】主菜单，2．在弹出的菜单中选择【网格设置】菜单项，3．在弹出的子菜单中选择【网格设置】菜单项，如图2-16所示。

第4步 弹出【网格设置】对话框，1．在【颜色】区域设置颜色，2．选中【显示网格】和【靠齐到网格】复选框，3．在【显示】区域选择【线】单选按钮，4．单击【确定】按钮，如图2-17所示。