Dreamweaver新手上碌姆.pptVIP

第三课 Dreamweaver新手上路;基础知识;重点知识;提高知识 ;课堂讲解;Dreamweaver MX 2004的界面介绍;Dreamweaver MX 2004界面介绍;图3-1; Dreamweaver MX 2004的工作界面主要由上面标注的几部分组成，下面对主要的部分进行讲解。 插入栏 文档工具栏 编辑窗口 网页标签 扩展按钮 浮动面板组 属性面板的使用 标签选择器 ;插入栏;图3-2; 若要重新以菜单方式显示，可单击图3-3右侧的 按钮，在弹出的菜单中选择“显示为菜单”命令即可，如图3-4所示。 在如图3-4所示的上侧单击相应的选项卡，下侧就会显示相应的工具按钮，图3-5～图3-9分别为“布局”、“表单”、“文本”、“HTML”和“应用程序”选项卡显示的工具栏。 ;图3-4; 文档工具栏; ：单击该按钮可以切换到“代码”视图和“设计”视图中。在该窗口中可同时看到同一文档的“代码”视图和“设计”视图。 ：单击该按钮可以切换到“设计”视图中。“设计”视图用于可视化页面布局、可视化编辑和快速应用程序开发的设计环境。在该视图中显示文档的完全可编辑的可视化表示形式，类似于在浏览器中查看页面时看到的内容。 ：在浏览器中预览/调试。单击该按钮后，在弹出的菜单中选择“预览在iexplore”命令后即可在IE浏览器中浏览或调试当前网页。 ：单击该按钮可以刷新当前网页。 ;图3-10;编辑窗口; 网页标签; 扩展按钮; 浮动面板组; 浮动面板组中的许多面板项目是非常有用的，可以通过选择“窗口”菜单中的相应项目来显示或关闭相应的面板，如要显示“文件”面板组，可通过选择[窗口]?[文件]菜单命令来实现。另外，如果想关闭某一面板组，则可单击该面板组右上角的 按钮，在弹出的菜单中选择“关闭面板组”命令即可。 ; 属性面板的使用;图3-12; 标签选择器; 菜单概述;“修改”菜单 “文本”菜单 “命令”菜单 “站点”菜单 “窗口”菜单 “帮助”菜单 ;“文件”菜单 ;保存网页：选择[文件]}[保存]菜单命令，则打开如图3-16所示的“另存为”对话框，在该对话框中选择保存网页的路径，再单击 按钮即可保存当前网页。另外，也可以按【Ctrl+S】键对网页进行保存。 在浏览器中预览：网页制作过程中，需要随时对网页进行浏览，以观看网页在浏览器中的具体显示效果，以便及时发现网页中的错误，方便设计者及时进行修改。要浏览网页，选择[文件]}[在浏览器中预览]}[iexplore]菜单命令即可，Dreamweaver会自动打开IE浏览器显示当前的网页，也可以按【F12】键来浏览当前网页。 ;图3-15;“编辑”菜单;“视图”菜单; “插入”菜单; “修改”菜单; “文本”菜单;“命令”菜单; “站点”菜单; “窗口”菜单; “帮助”菜单;Dreamweaver MX 2004中建立一般网页的方法; （1）启动Dreamweaver MX 2004。 选择[开始]?[程序]?[Macromedia]? [Macromedia Dreamweaver MX 2004]菜单命令，打开如图3-17所示的起始页。 （2）新建一个空白的HTML网页。 在起始页面的“创建新项目”栏中单击“HTML”选项（如图3-17所示），Dreamweaver即会自动创建一个空白的HTML网页。 ;图3-17; （3）在工作区中输入内容。 在工作窗口的“编辑窗口”中输入一些简单的句子，如“大家好，这是我的第一个测试网哦！”，如图3-18所示。 ; （4）浏览测试。 在工作区中添加内容后需要对做好的网页进行浏览测试。浏览测试的方法有3种，第1种是直接按【F12】键，这是最快捷的方法，建议大家以后尽量采用这种方法。第2种方法是单击如图3-10所示的“文档工具栏”中的 按钮，在弹出的菜单中选择“预览在iexplore”命令后即可在IE浏览器中浏览当前网页。第3种方法是选择[文件]?[在浏览器中预览]?[iexplore]菜单命令即可在IE浏览器中浏览测试当前网页。 ; （5）保存网页。 在浏览测试中，如果觉得比较满意，就可以保存当前网页了。 保存的方法也有多种，一种是直接按【Ctrl+S】键；另外一种方法是选择[文件]?[保存]菜单命令，在打开的“另存为”对话框中选择该网页的保存路径，然后单击 按钮。 ;上机实战;图3-19; 具体操作如下。 （1）启动Dreamweaver MX 2004程序，在打开的起始页面的“创建新项目”栏中单击