第三讲-使用Dreamweaver8创建和管理本地站点.ppt

单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,单击此处编辑母版标题样式,第,2,章,使用,Dreamweaver8,创建和管理本地站点,1,2,3,4,5,规划站点结构,认识,Dreamweaver 8,建立本地站点,管理本地站点,管理站点地图,6,网页文件的基本操作,1,认识,Dreamweaver 8,Dreamweaver,是美国,Macromedia,公司开发的集网页制作和网站管理于一身的网页制作软件，也是第一个专门为网页设计师量身定制的可视化网页制作软件，利用它可以方便、快捷地制作出跨越平台限制和浏览器限制的充满丰富动感的网页。,1.1 dreamweaver,版本排序,Dreamweaver 1.0(,发布于,1997,年,12,月）,Dreamweaver 1.2,（发布于,1998,年三月,),Dreamweaver 2.0,（发布于,1998,年,12,月）,Dreamweaver 3.0,（发布于,1999,年,12,月）,Dreamweaver UltraDev 1.0(,发布于,1999,年,12,月,),Dreamweaver 4.0,（发布于,2000,年,12,月）,Dreamweaver UltraDev 4.0(,发布于,2000,年,12,月,),Dreamweaver MX,（发布于,2002,年,5,月）,Dreamweaver MX 2004,（发布于,2003,年,9,月）,Dreamweaver 8(,发布于,2005,年,8,月,),Dreamweaver CS3(,发布于,2007,年,7,月,),Dreamweaver CS4(BETA,发布于,2008,年,5,月,17,日,),Dreamweaver CS4,（正式版发布于,2008,年,9,月,23,日）,Dreamweaver CS5,（正式版发布于,2010,年,4,月,12,日）,1.2 Dreamweaver8,的安装,1.2 Dreamweaver 8,工作界面,文档窗口,“插入”面板,“属性”面板,文档工具栏,面板组,文,件,面,板,状态栏,标题栏,显示应用程序的名称、最小化、最大化和正常之间的切换按钮以及关闭按钮,1.3,Dreamweaver 8,常用工具,菜单栏,文件：用来管理文件。,编辑：用来编辑文本，如剪切、复制、粘贴等，还包括“首选参,数”命令。,查看：可以设置文档的各种视图，可以显示和隐藏不同类型的,页面元素和工具栏。,插入：用来插入各种元素。,修改：具有对页面元素修改的功能。,文本：用来对文本进行操作。,命令：所有的附加命令项。,站点：用来创建和管理站点。,窗口：用来显示和隐藏控制面板以及切换文档窗口。,帮助：联机帮助功能。,“插入”面板,“插入”面板,集成了所有可以在网页应用的对象，包括“插入”菜单中的选项。有常用、布局、表单、文本、,HTML,、应用程序、,Flash,元素和收藏夹共,8,个二级菜单共,167,个按钮。,“插入”面板,其实就是图像化了的插入指令，通过一个个的按钮，可以很容易的加入图像、声音、多媒体动画、表格。图层、框架、表单、,Flash,和,ActiveX,等网页元素。,文档窗口,：,用于显示当前创建或编辑的文档,1.,文档标题栏,显示当前网页页面的标题及打开的文件名。,2.,文档,工具栏,文档工具栏包含可在代码视图、设计视图之间快速切换的按钮，并包含一些与选定视图有关的常用命令。,3.,页面编辑区,用于设置和编辑页面内的文本、图形和表格等。,状态栏,用于显示当前编辑文档的状态，主要包括文档的窗口大小、文档的大小和下载时间及标签选择器等。,属性面板,使用,“,窗口,”,菜单的,“,属性,”,选项或按快捷键,Ctrl+F3,，可显示或隐藏属性面板。,用于显示当前选定文本或图片等元素对象的属性，且可以用来修改选定对象的属性。,面板组,使用,“,窗口,”,菜单中的选项，可以显示或隐藏各种面板。,（,1,）资源面板,资源面板中列出了当前网页或站点中用到的各种网页元素,。,（,2,）行为面板,行为面板是编辑网页中由特定事件触发交互行为的地方，能为网页添加很多特殊效果。,（,3,）,CSS,样式面板,可以方便地定义,CSS,样式和管理,CSS,样式。,（,4,）代码检查器,列出了当前网页文件的,HTML,源代码，对不同的,HTML,源代码将用不同的颜色显示，并用黄色高亮显示错误代码。,（,5,）框架面板,框架面板以一种在文档窗口中不能显示的方式显示框架集的层次结构,。,（,6,）层面板,列出了当前网页中的层对象列表和叠放优先顺序：先建立的层位于列表的底部，最后建立的层位于列表的上部。使用层面板可以防止层重叠，改变层的可见性和叠放顺序。,（,7,）历史记录面板,历史记录面板自动记录了用户最近进行的,50,步操作。可以通过历史记录面板撤消已完成的操作,。,（,8,）参考面板,通过参考面板，用户可以快速地获得,JavaScript,、,HTML,、,CSS,和,BrowserDOMs,等的参考信息。,2,规划站点结构,站点规划是一个复杂的系统工程，包括一系列的组织、策划和设计。,规划站点结构是设计站点的必要前提，其操作是将不同的文件分类存放在文件夹中以便于设计者管理。合理地组织站点结构，可提高工作效率，加快对站点的设计。,一般来说，整个站点是一个大的文件夹，其中又包括许多小文件夹，分别存放站点中不同类型的文件。,2.1,按照文件的类型对文件进行规划,将不同类型的文件分别存放在不同的文件夹中。,2.2,按照主题对文件进行规划,在根文件夹下根据网站不同的主题分类。,可以根据规划绘制出一个网站结构草图，以便于有一个清晰的思路。,外语影片,“零零影视”网站首页,动作片,国语影片,喜剧片,外语影片,国语影片,爱情片,外语影片,国语影片,今日推荐,艺术片,外语影片,国语影片,恐怖片,外语影片,国语影片,影星专辑,2.3,了解文件目录命名及目录结构规范,1,文件和文件夹的命名,文件和文件夹命名时需要注意以下,4,点。,（,1,）不能使用中文,在所有的操作系统中，只有英文字符和数字的编码是完全一致的，也就是说，采用其他的字符（如中文字符）就可能导致许多人无法正常浏览用户的网站。,（,2,）最好使用小写,因为有些操作系统（如,UNIX,等）对大小写敏感，对它们而言，,index.htm,和,。,4,管理本地站点,选择本地站点,删除站点中的文件和文件夹,更改站点信息,5,管理站点地图,5.1,定义主页,在使用站点地图查看站点时必须保证这个站点已定义了一个主页，因为主页是一个站点的根节点，必须有根节点才有各个支节点，也就是各个子页。,5.2,查看站点地图,查看站点地图是在,Dreamweaver 8,的“文件”面板的“视图”下拉列表框中选择“地图视图”选项。,5.3,在站点地图中管理页面文件,打开页面文件,在页面文件上双击鼠标即可打开该文件。,在选择页面之后，选择,文件,打开,菜单命令打开页面。,选择页面后单击鼠标右键，在弹出的快捷菜单中选择“打开”命令可打开页面。,新建页面文件,在建立好站点地图之后，如果还需要在其中添加新的网页文件，可以在站点地图中新建一个页面文件。,更改页面标题,在站点地图中可对页面标题进行更改，以方便对站点的管理。,6,网页文件的基本操作,新建网页,除了可以在“文件”面板中可以新建网页还可以通过以下的操作新建网页：,1,执行以下操作之一：,单击菜单栏中“文件”,|“,新建”命令。,单击标准工具栏上的按钮。,2,打开“新建文档”对话框。,3,选择“基本页”选项中的“,HTML”,，单击“创建”按钮，即可新建一个空白的文档。,保存网页,新建网页要进行保存，保存网页的操作为：,1,执行以下操作之一：单击菜单栏中“文件”,|“,保存”命令 单击标准工具栏上的 按钮。,2,打开“另存为”对话框。,3,在“保存在”选项中选择网页的保存位置。在“文件名”文本框中的输入文件名。,4,单击“保存”按钮，文件就保存到指定位置。,打开网页,打开己保存的网页有以下三种方法,1,、通过文件菜单打开己有的网页，具体操作为：（,1,）执行以下操作之一：单击菜单栏中的“文件”,|“,打开”命令。或单击标准工具栏上的。（,2,）打开“打开”对话框。（,3,）在查找范围下拉列表中选择网页所在的文件夹，选择要打开的文件，单击“打开”按钮，即可打开了文件。,2,、在“文件”面板中打开网页文件在“文件”面板中，双击要打开的文件，即可打开网页。,3,、在资源管理器中打开网页文件在资源管理器中，右击要打开的网页文件，在弹出的快捷菜单中选择“在,Dreamweaver8”,中编辑即可将文件在,Dreamweaver8,中打开。,预览网页,编辑好的网页可以随时在浏览器中预览文档，查看网页的版式及链接的完好性，从而对网页进行修改。以在,Iexplore,中预览为例，执行以下操作之一：单击菜单栏中“文件”,|“,在浏览器中“预览”,|“Iexplore 6.0”,命令。使用快捷键为,F12,。在文档工具栏中单击，选择在浏览器中预览。,上机实践,本课上机实战将练习创建一个名为“国画欣赏”的站点，将其中的本地站点保存在“,D:guohua”,文件夹下。然后为“国画欣赏”网站建立一个存放图片的文件夹“,images”,，并新建名为“,index.html”,、“,ghzs.html”,、“,jrmh.html”,、“,ghds.html”,、“,flxs.html”,、“,ghlt.html”,和“,lxwm.html”,的网页文件。,国画知识,分类欣赏,联系我们,国画大师,“国画欣赏”网站首页,今日名画,国画论坛,