Dreamweaver 80 界面及站点建设

,*,单击此处编辑母版标题样式,21世纪高等院校规划教材,Dreamweaver 8 基础与实例教程,马宪敏 主编,中国水利水电出版社,1,第1,章,章Dreamweaver8.0,界,界,面,面,及,及,站,站,点,点,建,建,设,设,第1,章,章Dreamweaver8.0,界,界,面,面,及,及,站,站,点,点,建,建,设,设,1.1Dreamweaver8.0,简,简,介,介,1.2,创,创,建,建,站,站,点,点,1.3,网,网,页,页,文,文,件,件,的,的,基,基,本,本,操,操,作,作,1.4,设,设,置,置,页,页,面,面,属,属,性,性,1.5,练,练,习,习,制,制,作,作,简,简,单,单,的,的,网,网,页,页,站,站,点,点,3,1.1Dreamweaver8.0,简,简,介,介,1.1.1Dreamweaver8.0,的,的,启,启,动,动,和,和,退,退,出,出,1.1.2Dreamweaver8.0,的,的,工,工,作,作,环,环,境,境,4,1.1.1Dreamweaver8.0,的,的启动,和,和退出,1.启,动,动Dreamweaver8.0,在Windows操,作,作系统,下,下，单,击,击左下,角,角的【,开,开始】,按,按钮，,从,从【程,序,序】菜,单,单中选,择,择Macromedia菜,单,单，然,后,后从子,菜,菜单中,单,单击【Macromedia Dreamweaver 8,】,】即可,启,启动，,如,如图所,示,示。,5,2.退,出,出Dreamweaver8.0,退出Dreamweaver 8.0的,方,方法很,简,简单，,我,我们可,以,以有以,下,下几种,方,方式退,出,出编辑,界,界面：,（1）,单,单击Dreamweaver 8,窗,窗口右,上,上方的,关,关闭按,钮,钮；,（2）,按,按下“Alt+F4,”,”组合,键,键；,（3）,选,选择“,文,文件”,菜,菜单中,的,的“退,出,出”命,令,令，或,按,按快捷,键,键Ctrl+Q退出,系,系统。,6,1.1.2Dreamweaver8.0,的,的工作,环,环境,Dreamweaver8.0,的,的操作,窗,窗口,7,1.2,创,创建站,点,点,1.2.1,创,创建本,地,地站点,1.2.2,管,管理站,点,点,1.2.3,管,管理网,站,站中的,文,文件和,文,文件夹,8,1.2.1,创,创建本,地,地站点,步骤1,：,：在本,地,地硬盘,上,上建立,一,一个用,来,来存放,站,站点的,文,文件夹,，,，命名,为,为“site,”,”，该,文,文件夹,就,就是本,地,地站点,的,的根目,录,录，是,为,为网站,特,特别建,立,立的一,个,个文件,夹,夹。,步骤2:打开Dreamweaver8.0,，,，选择,“,“站点,”,”菜单,下,下的“,管,管理站,点,点”命,令,令，或,者,者选择,文,文件面,板,板中的,“,“管理,站,站点”,命,命令，,打,打开,“,“管理,站,站点”,对,对话框,。,。,9,步骤3:单击,“,“管理,站,站点”,对,对话框,中,中的“,新,新建”,按,按钮，,在,在弹出,菜,菜单中,选,选择“,站,站点”,命,命令。,10,步骤4,：,：单击,“,“站点,”,”命令,后,后，系,统,统会弹,出,出窗口,，,，这是,一,一个定,义,义站点,的,的向导,，,，选择,“,“基本,”,”选项,卡,卡，给,网,网站定,义,义一个,名,名称，,例,例如“,数,数学与,计,计算机,系,系”。,11,步骤5,：,：单击,“,“下一,步,步”按,钮,钮，在,窗,窗口中,设,设置网,站,站是否,使,使用服,务,务器技,术,术，例,如,如：ASP、PHP,等,等。由,于,于我们,要,要制作,的,的是基,本,本的静,态,态网站,，,，所以,选,选择“,否,否，我,不,不想使,用,用服务,器,器技术,”,”单选,按,按钮。,12,步骤6,：,：单击,“,“下一,步,步”按,钮,钮，开,始,始设置,网,网页的,存,存储方,法,法和存,储,储路径,。,。在上,半,半部分,的,的单选,项,项中选,择,择第一,项,项“编,辑,辑我的,计,计算机,上,上的本,地,地副本,，,，完成,后,后再上,传,传到服,务,务器（,推,推荐）,”,”。如,果,果申请,的,的网站,空,空间支,持,持在线,编,编辑功,能,能，那,么,么可以,选,选择“,使,使用本,地,地网络,直,直接在,服,服务器,上,上编辑,”,”单选,项,项。,13,步骤7,：,：完成,以,以上的,设,设置后,单,单击“,下,下一步,”,”按钮,，,，在这,里,里选择,连,连接服,务,务器的,方,方式，,以,以及网,页,页在服,务,务器上,的,的存储,位,位置。,14,步骤8,：,：单击,“,“下一,步,步”按,钮,钮。在,这,这里选,择,择是否,使,使用“,存,存回”,和,和“取,出,出”。,选,选中“,是,是，启,用,用存回,和,和取出,”,”选项,，,，可以,多,多人共,同,同完成,网,网站的,维,维护工,作,作。如,果,果只需,一,一个就,能,能够完,成,成网站,的,的维护,工,工作，,可,可以选,择,择“否,”,”。,15,步骤9：至此,完,完成了对网站,的,的基本定义。,单,单击“下一步,”,”按钮，Dreamweaver 8.0会弹出对话,框,框询问设置的,信,信息是否准确,，,，单击“完成,”,”按钮，本地,站,站点就创建成,功,功了。,16,1.2.2,管,管理站点,1.切换站点,Dreamweaver8.0中可以,同,同时存在多个,站,站点，在文件,面,面板左边的下,拉,拉列表框中选,中,中某个已创建,的,的站点，就可,切,切换到对这个,站,站点进行操作,的,的状态。,17,2编辑站点,如果要对站点,进,进行编辑，可,以,以在“管理站,点,点”对话框中,，,，选择要编辑,的,的站点，然后,用,用鼠标单击“,管,管理站点”对,话,话框中的“编,辑,辑”按钮，重,新,新打开“站点,定,定义”向导，,根,根据需要一步,一,一步修改站点,的,的属性即可。,18,3删除站点,如果不需要某,个,个站点时，可,以,以将其从站点,列,列表中删除。,选,选择“站点”,菜,菜单下的“管,理,理站点”命令,，,，打开“管理,站,站点”对话框,，,，在该对话框,中,中选择一个站,点,点，单击“删,除,除”按钮，即,可,可删除一个站,点,点，对某一个,站,站点进行删除,操,操作后，网站,的,的文件仍保存,在,在硬盘原来的,位,位置上，并没,有,有从硬盘上删,除,除。,19,1.2.3管,理,理网站中的文,件,件和文件夹,1创建文件,夹,夹和文件,文件面板通常,显,显示站点中的,所,所有文件和文,件,件夹，但新建,的,的站点中不包,含,含任何文件或,文,文件夹。所有,的,的文件和文件,夹,夹都需要新建,，,，在文件面板,中,中站点根目录,上,上单击鼠标右,键,键，然后从弹,出,出的快捷菜单,中,中单击菜单项,“,“新建文件夹,”,”或“新建文,件,件”，接着给,新,新的文件夹或,文,文件命名。,20,2重命名文,件,件夹或文件,先选中需要重,命,命名的文件夹,或,或文件，然后,单,单击右键，在,弹,弹出的快捷菜,单,单中单击“编,辑,辑”选项的下,级,级菜单中的“,重,重命名”命令,或,或者按【F2,】,】快捷键，文,件,件夹或文件的,名,名称变为可编,辑,辑状态，重新,输,输入新的名称,，,，按Enter键确认即可,。,。,3移动和复,制,制文件,从“文件”面,板,板的本地站点,文,文件列表中，,选,选中要移动或,复,复制的文件夹,或,或文件，如果,要,要进行移动操,作,作，在弹出的,快,快捷菜单中单,击,击“编辑”选,项,项的下级菜单,中,中的“剪切”,命,命令；如果要,进,进行复制操作,，,，则执行“编,辑,辑”选项的“,拷,拷贝”命令，,然,然后执行“编,辑,辑”选项下的,“,“粘贴”命令,，,，将文件夹或,文,文件移动或复,制,制到相应的文,件,件夹中。,4删除文件,夹,夹或文件,要从本地站点,文,文件列表中删,除,除文件夹或文,件,件，先选中要,删,删除的文件夹,或,或文件，然后,执,执行“编辑”,选,选项同上的“,删,删除”命令或,按,按Delete键，这时系,统,统会弹出一个,提,提示对话框，,询,询问是否要真,正,正删除文件夹,或,或文件，单击,“,“是”按钮确,认,认后即可将文,件,件夹或文件从,本,本地站点中删,除,除。,21,1.3 网页,文,文件的基本操,作,作,1.3.1,创,创建网页和打,开,开网页,1.3.2,保,保存网页,1.3.3,在,在浏览器中预,览,览网页,22,1.3.1,创,创建网页和打,开,开网页,1.新建网页,单击“文件”,菜,菜单下“新建,”,”命令，即可,弹,弹出“新建文,档,档”对话框。,从,从“类别”列,表,表框中选择“,基,基本页”选项,，,，然后选择“,基,基本页”列表,框,框中的“HTML”选项。,单,单击“创建”,按,按钮，即可新,建,建一个空白的HTML网页,文,文档。,23,2.打开网页,单击“文件”,菜,菜单选择“打,开,开”命令，弹,出,出“打开”对,话,话框。在该对,话,话框内选中要,打,打开的HTML文档，单击,“,“打开”按钮,，,，即可将选定,的,的HTML文,档,档打开。也可,以,以在“文件”,面,面板上，双击,“,“站点目录”,中,中的网页文件,也,也可以打开网,页,页文件。,24,1.3.2保,存,存网页,在完成创建、,编,编辑的网页之,后,后，关键的一,步,步就是保存网,页,页，否则一切,都,都是徒劳的，,保,保存网页有如,下,下几种方法：,单击“文件”,菜,菜单选择“保,存,存”命令，可,以,以原名字原路,径,径保存当前的,文,文档。,单击“文件”,菜,菜单选择“另,保,保存”命令，,可,可弹出“另存,为,为”对话框。,利,利用该对话框,可,可以将当前的,文,文档以其他名,字,字保存。,单击“文件”,菜,菜单选择“保,存,存全部”命令,，,，可将当前正,在,在编辑的所有,文,文档以原名保,存,存。,25,1.3.3在,浏,浏览器中预览,网,网页,单击标准工具,栏,栏上的预览按,钮,钮或按“F12”可在浏览,器,器中预览所编,辑,辑的网页。,26,1.4 设置,页,页面属性,步骤1：打开Dreamweaver8.0，新建一,个,个网页，或者,打,打开一个现有,的,的网页，选择,“,“修改”菜单,下,下的“页面属,性,性”命令，或,者,者单击属性面,板,板中的“页面,属,属性”按钮，,打,打开“页面属,性,性”对话框。,27,步骤2：在“,页,页面属性”对,话,话框中设置“,外,外观”参数，,选,选择“页面属,性,性”中的“外,观,观”选项同，,在,在右侧可能设,置,置具体的参数,。,。,28,步骤3：页面,属,属性设置完成,后,后，单击“确,定,定”保存设置,，,，然后中再打,开,开“页面属性,”,”对话框，并,选,选择左侧的“,分,分类”列表中,的,的“链接”选,项,项同，在右侧,可,可以对链接的,样,样式进行详细,的,的设置。,29,1.5 练习,制,制作简单的网,页,页站点,1.创建一个,名,名为“计算机,基,基础精品课程,”,”的站点，将,其,其中的本地站,点,点保存在“D:computer”文,件,件夹下，远程,站,站点保存在“D:computer”,文,文件夹下。根,据,据如图所示的,网,网站的逻辑图,，,，为“计算机,基,基础精品课程,”,”网站建立一,个,个存放图片的,文,文件夹“images”，,并,并新建名为“index.html”、,“,“teacher.html”、“jiaoxue.html”、,“,“shiyan.html,”,”、“rili.html,”,”、“kejian.html”和“luxiang.html”,的,的网页