1.5　认识Dreamweaver CS6

1.5.1　Dreamweaver CS6简介

Dreamweaver CS6是Adobe公司推出的一套拥有可视化编辑界面，用于制作并编辑网站和移动应用程序的网页设计软件。它支持代码、拆分、设计、实时视图等多种方式来制作、编写和修改网页。CS6版本使用了自适应网格版面创建页面，在发布前使用多屏幕预览审阅设计，大大提高了工作效率，同时也增加了很多新功能。

1.5.2　启动和退出Dreamweaver CS6

Dreamweaver CS6的启动和退出，同其他程序没什么大的区别。安装Dreamweaver CS6后，会在“开始”菜单的“所有程序”列表中添加启动程序菜单，只需选择“开始”/“所有程序”/“Adobe Dreamweaver CS6”命令即可启动该软件，用户也可自己添加桌面快捷方式来启动Dreamweaver CS6。退出Dreamweaver CS6的方法有如下几种：

① 单击主界面右上方的按钮退出；

② 选择“文件”/“退出”命令退出；

③ 单击主界面左上方的图标，在弹出的快捷菜单中选择“关闭”命令退出；

④ 直接按“Alt+F4”快捷键退出。

1.5.3　认识Dreamweaver CS6的工作界面

　启动Dreamweaver CS6后，可进入其设计主界面，该界面主要由菜单栏、文档工具栏、文档窗口、状态栏、属性面板和面板组等组成，如图1-33所示。

图　1-33

1．菜单栏

菜单栏中主要包括“文件”“编辑”“查看”“插入”“修改”“格式”“命令”“站点”“窗口”和“帮助”10个菜单。单击任意一个菜单，都会弹出下拉菜单，使用下拉菜单中的命令基本能够实现Dreamweaver CS6中的所有功能。菜单栏中还包括一个工作界面切换器和一些控制按钮。

2．文档工具栏

使用文档工具栏可以在文档的不同视图之间进行切换，如“代码”视图和“设计”视图等，在工具栏中还包含各种查看选项和一些常用的操作。

①“代码”按钮：单击该按钮，仅在文档窗口中显示和修改HTML源代码。

②“拆分”按钮：单击该按钮，可在文档窗口中同时显示HTML源代码和页面的设计效果。

③“设计”按钮：单击该按钮，仅在文档窗口中显示网页的设计效果。

④“在浏览器中预览/调试”按钮：单击该按钮，在弹出的下拉菜单中选择一种浏览器，用于预览和调试网页。

3．文档窗口

文档窗口用于显示当前创建和编辑的文档。在该窗口中，可以输入文字、插入图片和表格等，也可以对整个页面进行设置，通过单击文档工具栏中的“代码”按钮、“拆分”按钮、“设计”按钮或“实时视图”等按钮，可以分别在窗口中查看代码视图、拆分视图、设计视图或实时显示视图。

4．状态栏

状态栏位于文档窗口的底部，提供与用户正在创建的文档有关的其他信息。状态栏中包括标签选择器、窗口大小弹出菜单和下载指示器等。

5．属性面板

属性面板是网页中非常重要的面板，用于显示文档窗口中所选元素的属性，并且可以对选择的元素的属性进行修改。该面板中的内容因选定的元素不同会有所不同。

6．面板组

面板组位于工作界面的右侧，用于帮助用户监控和修改工作，其中包括“插入”面板、“CSS样式”面板和“组件”面板等。

① 打开面板：如果需要使用的面板没有在面板组中显示出来，则可以使用“窗口中”菜单将其打开。

② 关闭与打开全部面板：按F4键，即可关闭工作界面中所有的面板，再次按F4键，关闭的面板又会显示在原来的位置上。