资源描述
单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,#,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,#,書式設定,書式設定,第 2,第 3,第 4,第 5,#,書式設定,書式設定,第 2,第 3,第 4,第 5,#,单击此处编辑母版标题样式,单击此处编辑母版文本样式,#,项目一 创建“夕照台”房产网站,网页制作基础,一、学习目标,二、理论指导,三、任务实践,一、学,习,习目标,了解网,页,页的构,成,成元素,，,，网页,的,的本质,，,，以及,动,动态网,页,页和静,态,态网页,的,的区别,。,。,了解IP地址、,域,域名和,网,网址的,概,概念，,以,以及网,站,站管理,与,与网页,制,制作相,关,关软件,，,，XHTML语言和,网,网站建,设,设流程,。,。,认识DreamweaverCS5的界面,元,元素。,掌握规,划,划网站,结,结构以,及,及在Dreamweaver中定义,和,和管理,站,站点的,方,方法。,掌握网,页,页文档,和,和文件,夹,夹的命,名,名规则,，,，以及,在,在Dreamweaver中新建,、,、打开,、,、保存,和,和预览,网,网页的,方,方法，,另,另外还,要,要学会,使,使用“,文,文件”,面,面板管,理,理站点,文,文件和,文,文件夹,。,。,二、理,论,论指导,（一）,认,认识网,站,站和网,页,页,网页就,是,是我们,上,上网时,在,在浏览,器,器中打,开,开的一,个,个个画,面,面，网,站,站则是,一,一组相,关,关网页,的,的集合,。,。一个,小,小型网,站,站可能,只,只包含,几,几个网,页,页，而,一,一个大,型,型网站,则,则可能,包,包含成,千,千上万,个,个网页,。,。,打开某,个,个网站,时,时显示,的,的第一,个,个网页,被,被称为,网,网站的,主,主页（,或,或首页,）,）。,1网页,的,的构成,元,元素,我们可,以,以将网,页,页中的,元,元素按,功,功能分,为,为站标,、,、导航,条,条、广,告,告条、,标,标题栏,和,和按钮,等,等，如,图,图1-1所示。,站标,导航条,广告条,按钮,标题栏,（1）站标,站标也,叫,叫Logo，是网,站,站的标,志,志，其,作,作用是,使,使人看,见,见它就,能,能够联,想,想到企,业,业。因,此,此，网,站,站Logo通常采,用,用企业,的,的Logo。,Logo一般采,用,用蕴含,企,企业文,化,化和特,色,色的图,案,案，或,是,是与企,业,业名称,相,相关的,字,字符或,符,符号及,其,其变形,，,，当然,也,也有很,多,多是图,文,文组合,，,，如下,图,图所示,。,。,（2）导航,条,条,导航条,是,是一组,链,链接到,网,网站内,主,主要页,面,面的超,链,链接组,合,合，通,过,过单击,这,这些超,链,链接，,浏,浏览者,可,可以轻,松,松找到,网,网站中,的,的各个,页,页面。,设,设计导,航,航条时,，,，应遵,循,循以下,原,原则：,对于一,般,般的企,业,业网站,，,，如果,网,网站内,容,容不多,，,，可根,据,据网站,风,风格灵,活,活摆放,导,导航条,，,，也可,以,以使用,图,图片或Flash动画等,显,显示导,航,航条，,如,如下图,所,所示。,对于像,搜,搜狐、,网,网易等,大,大型门,户,户类网,站,站，网,站,站栏目,都,都很多,，,，一般,将,将导航,条,条分为,多,多排放,置,置在Logo的下方,或,或右侧,。,。为便,于,于查看,，,，可为,各,各排设,置,置不同,的,的底色,，,，如下,图,图所示,。,。,（3）广告,条,条,广告条,又,又称Banner，其功,能,能是宣,传,传网站,或,或为其,他,他商品,做,做广告,。,。Banner的尺寸,可,可以根,据,据内容,或,或版面,需,需要来,安,安排。,在制作Banner时，有,以,以下几,点,点需要,注,注意。,Banner可以是,静,静态的,，,，也可,以,以是动,态,态的。,Banner的体积,不,不宜过,大,大，尽,量,量使用GIF格式图,片,片与动,画,画或Flash动画。,Banner中的文,字,字不要,太,太多。,Banner中图片,的,的颜色,不,不要太,多,多，尤,其,其是GIF格式的,图,图片或,动,动画，,要,要避免,出,出现颜,色,色的渐,变,变和光,晕,晕效果,。,。,（4）标题,栏,栏,此处的,标,标题栏,不,不是指,整,整个网,页,页的标,题,题栏，,而,而是网,页,页上各,版,版块的,标,标题栏,，,，是各,版,版块内,容,容的概,括,括。它,使,使得网,页,页内容,的,的分类,更,更清晰,、,、明了,，,，大大,地,地方便,了,了浏览,者,者。,标题栏,可,可以是,文,文字加,不,不同颜,色,色的背,景,景，也,可,可以是,图,图片，,这,这由网,站,站的整,体,体风格,决,决定。,（5）按钮,按钮通,常,常是启,动,动某些,装,装置或,机,机关的,开,开关。,网,网页中,的,的按钮,也,也不例,外,外，单,击,击它，,网,网页会,实,实现相,应,应的操,作,作，比,如,如跳转,到,到其他,页,页面，,或,或提交,数,数据等,。,。,2网页,的,的本质,在浏览,器,器中选,择,择“文,件,件”“另存为,”,”菜单,，,，将网,页,页保存,到,到磁盘,中,中，便,可,可看到,网,网页的,组,组成文,件,件。,3动,态,态网页,和,和静态,网,网页,从制作,技,技术的,角,角度来,讲,讲，网,页,页可分,为,为静态,网,网页和,动,动态网,页,页。完,全,全采用HTML技术制,作,作的网,页,页称为,静,静态网,页,页；使,用,用HTML、编程,语,语言和,数,数据库,共,共同完,成,成，需,要,要与数,据,据库实,时,时交互,的,的网页,称,称为动,态,态网页,。,。,（二）,网,网站开,发,发基础,1IP地址、,域,域名和,网,网址,（1）IP地址,互联网,是,是全世,界,界范围,内,内的计,算,算机联,为,为一体,而,而构成,的,的通信,网,网络。,互,互联网,上,上连接,了,了不计,其,其数的,服,服务器,和,和客户,机,机，每,一,一个主,机,机在互,联,联网上,都,都有一,个,个唯一,的,的地址,，,，我们,称,称这个,地,地址为IP地址（InternetProtocolAddress）。IP地址由4个小于256的数字,组,组成，,数,数字之,间,间用点,间,间隔。,例,例如，,“,“61.135,.,.150.126”就是一,个,个IP地址。,（2）域名,（3）网址,网址又,叫,叫URL，英文,全,全称是,“,“Uniform Resource Locator,”,”，即统,一,一资源,定,定位符,。,。它是,网,网络上,通,通用的,一,一种地,址,址格式,，,，用于,标,标识网,页,页文件,在,在网络,中,中的位,置,置。,一个完,整,整的网,址,址由通,信,信协议,名,名称、,域,域名或IP地址、,网,网页在,服,服务器,中,中的路,径,径和文,件,件名4部分组,成,成。,2网站,管,管理与,网,网页制,作,作相关,软,软件,Dreamweaver是目前,最,最常用,的,的网站,管,管理和,网,网页制,作,作软件,，,，其功,能,能全面,、,、操作,灵,灵活、,专,专业性,强,强。另,外,外，它,还,还可以,作,作为动,态,态网站,的,的开发,环,环境。,在制作,网,网页时,，,，除Dreamweaver外还需,要,要用到Fireworks、Flash、Photoshop等辅助,软,软件。,3网,页,页制作,基,基础,XHTML,语,语言,XHTML是Extensible HyperTextMarkupLanguage,(,(可扩,展,展超文,本,本标记,语,语言),的,的英文,缩,缩写，,它,它的前,身,身是HTML,。,。由于HTML代码,烦,烦琐，,结,结构松,散,散，所,以,以推出,了,了XHTML,。,。也可,以,以说，XHTML是HTML的一,个,个升级,版,版本。,XHTML语言的,核,核心是,标,标签（,或,或者称,为,为标记,）,）。也,就,就是说,，,，我们,在,在浏览,网,网页时,看,看到的,文,文字、,图,图像、,动,动画等,在,在XHTML文档中,都,都是用,标,标签来,描,描述的,。,。,4网,站,站建设,流,流程,网站建,设,设流程,是,是指从,企,企业计,划,划建设,网,网站到,网,网站建,设,设完成,的,的一套,规,规范化,运,运作过,程,程。,（三）,初,初识Dreamweaver CS5,1启动DreamweaverCS5,安装DreamweaverCS5后，单,击,击桌面,左,左下角,的,的“开,始,始”按,钮,钮，,选,选择“,所,所有程,序,序”“Adobe Dreamweaver CS5”，就可,以,以启动DreamweaverCS5了。,2Dreamweaver CS5界,面,面元素,简,简介,DreamweaverCS5的工作,界,界面由,应,应用程,序,序栏、,文,文档标,签,签、文,档,档工具,栏,栏、文,档,档窗口,、,、标签,选,选择器,、,、状态,栏,栏、属,性,性检查,器,器和面,板,板组等,组,组成。,（1）应用,程,程序栏,应用程,序,序栏位,于,于工作,区,区顶部,，,，左侧,显,显示菜,单,单栏，,右,右侧包,含,含工作,区,区切换,器,器、“CSLive”按钮和,程,程序窗,口,口控制,按,按钮。,（2）文档,标,标签栏,文档标,签,签栏位,于,于应用,程,程序栏,下,下方，,左,左侧显,示,示当前,打,打开的,所,所有网,页,页文档,的,的名称,及,及其关,闭,闭按钮,（,（标签,）,）；右,侧,侧显示,当,当前文,档,档在本,地,地磁盘,中,中的保,存,存路径,以,以及向,下,下还原,按,按钮；,下,下方显,示,示当前,文,文档中,的,的包含,文,文档以,及,及链接,文,文档。,当,当用户,打,打开多,个,个网页,时,时，通,过,过单击,文,文档标,签,签可在,各,各网页,之,之间切,换,换。另,外,外，单,击,击下方,的,的包含,文,文档或,链,链接文,档,档，可,打,打开相,应,应文档,。,。,（3）文档,工,工具栏,文档工,具,具栏位,于,于文档,标,标签下,方,方，包,括,括各种,可,可对文,档,档进行,操,操作的,按,按钮。,（4）状态,栏,栏,状态栏,位,位于文,档,档窗口,底,底部，,它,它提供,了,了与当,前,前文档,相,相关的,一,一些信,息,息。,（5）属性,检,检查器,使用“,属,属性检,查,查器”,可,可以检,查,查和设,置,置当前,选,选定页,面,面元素,（,（如文,本,本和插,入,入对象,）,）的最,常,常用属,性,性。“,属,属性检,查,查器”,中,中的内,容,容会根,据,据选定,元,元素的,变,变化而,变,变化。,（6）面板,组,组,默认状,态,态下，,面,面板组,位,位于文,档,档窗口,右,右侧。,面,面板组,中,中包含,各,各种类,型,型的面,板,板，Dreamweaver中的大,部,部分操,作,作都需,要,要利用,面,面板来,实,实现。,其,其中最,常,常用的,有,有“插,入,入”面,板,板、“,文,文件”,面,面板和,“,“CSS样式”,面,面板，,后,后面将,陆,陆续用,到,到。,（四）,在,在Dreamweaver中定义,和,和管理,网,网站,1定义,网,网站,定义网,站,站的目,的,的是把,本,本地磁,盘,盘中的,站,站点文,件,件夹同Dreamweaver建立一,定,定的关,联,联，从,而,而方便,用,用户使,用,用Dreamweaver管理站,点,点和编,辑,辑站点,中,中的网,页,页文档,，,，以及,上,上传或,下,下载站,点,点内容,等,等。,2管理,网,网站,定义
展开阅读全文