实训一制作一个简单的网页

1、实训一创立和治理站点、制作站点首页实训目标：用Dreamweaver制作一个简单的网页、用Dreamweaver创立和治理站点一在D盘上创立“畅想未来站点在菜单栏中选择“站点一“新建站点,在文本框中输入网站的名称“畅想未来选择站点畅想未来的本地根文件夹:0®J本地磁盘0D；)我最近的文档桌面pOELLi)DocumentsandSettings二)drvrtmp_)InetpubProgramFliesWINDOWSi二)教材光盘我的文档我的电脑选择:D：物想未来的玷点定义为在开发过程中,如打苴如何使用您的文件T根本南铜羯我的目曾机的本地副本完成后再I像到眠ass推荐堡.使用本地网络

2、直接在效劳器上进行编相8计篁机卜的什么位置？k上一步汴一步出取消匚帮助二格濯未来的站点定义为(二)对站点进行规划1.在文件面板中搭建站点的结构(1)在站点根文件夹下建立4个子文件夹"city"、"novel"、"outspace"和"travel(2)在文件夹“新建文恃3)斯建文畔夫翻开打JT方式国)编辑国)选择费取嫡期.出里)卜偌(L)在回IH)除消取出3显示取出假设CE)回退页)与远端比拟区)同步述盖仁)city中建4个子文件夹“images"、"sound"、"swf"

3、和"webpages.novel(3)将文件夹"city中的4个子文件夹分别复制到"novel"、"outspace"和"travel中.方法：依次选中“images"、"sound"、"swf"和"webpages,然后按住Ctrl键,分别将其拖动到outspace"和"travel中.三0站点-畅想未来WlEirtuGB-QcitygiMillllimi|MIlli|M|*i!|ila|MIIWEOWlddwiiiiiHliIImliiimi

4、iidfiiiliH'feiiiriviiiEWfn仃el-匕aut5pa.ce占tr结果如下列图所示.(二)设置网站首页,重新搭建站点结构1 .设置网站首页(1)右单击站点的根文件夹,从弹出的快捷菜单中选择“新建文件命令.(2)将文件重命名为3将其设置成首页.拜期售取出鱼上传心存回QP揄肖取出出蛆叵【退页保,与运茹比拟出同步ZJ-新建文件r>新建攵件夹里j翻开翻开方式便1编捐区选择遮盖QL洎口只读他性CT1远端站点中定位皿tVtacigqggi君凡gegg假设qgqa.oa-ra-ffl-w-&高二甲-圉.,*!-J*-.可®-a-费涯I代码片断O畅想,未来3

5、本地觇图晟oTb岩口命gFlO砧点-曲想未来W-futiure)SIindcc.l在浏览器中颈苑但检置链接at2 .重新搭建站点结构1将站点的根文件夹下的4个子文件夹“city"、"novel"、"outspace"和"travel删除.2在站点的根文件夹下新建“images"和"webpages",如下列图所示.2个子文件夹,并将其另存为.在Dreamweaver中翻开文件、设置网页属性选择“修改一“页面属性,翻开“页面属性对话框.一设置页面外观在“分类“外观中按下列图设置“页面字体:宋体、“文本颜色:

6、#034881、“背景颜色:#B8DCF4二设置页面标题在“分类一“标题/编码中按下列图设置“标题：畅想未来.三按F12键,保存并预览网页三、制作网页一编辑文本1 .编辑网页中的文本.按下列图编辑网页中的文本.换行标记br的使用HTML±件中任何位置只要使用了br标记,当文件显示在浏览器中时,该位置之后的文字将显示于下一行,该br标记就是起到换行的标记.段落标记p的使用由p标记所标识和文字,代表同一个段落的文字.在浏览器中,不同段落文字间除了换行外,有时还会以一行空白加以间隔,以便区别出文字的不同段落,其语法如下：p文字/pbr和p的有什么区别呢？通俗的讲就是,它们在分行的时候br分

7、得行比p分得行距比拟大！在HTML弋码中,br是换行符,表示强制性换到下一行.而p那么是分段符,相当于回车,等同于两个圻.pCopyright?2007-200x畅想工作室,AllRightsReserved/pp如果您对我们的效劳有任何意见或建议,请惠赐E-mail至/pp联系：8联系人：丝雨轻梦/pCopyright?2007-200x畅想工作室,AllRightsReserved<br/>如果您对我们的效劳有任何意见或建议,请惠赐E-mail至<圻/>联系：8联系人：丝雨轻梦2 .设置文本格式(1)在第一行前输入2个空格,并去掉最后3行之间的空行,如下列图所示.未

8、来旅游丰平通m展星太空n-科幻小说口二谩乃首页网站治理至满美/Rtl笆.希基将*爵士和苗首谭飞秋I：&界羌¥方空最向飘篮.空气洁净洁新.西浮并存停地,一切都井燃力,这可能是朴乌野日式的空想,但是如墨次门都朝这十方可努力的话,那梦想就真可能变成蠲卖口也装初一边Copwigtkt72OQ7-2,?0.幅揖工作更,AllRi曲iuRaE4srvad项华区对我门的用我有叮可意见或:里浪,遁蔓至,tfch_i®g旧联系：CR55-12345678藤系大二丝南我梦主宰都市300(2)将“未来都市、“未来旅游、“未来通讯、“展望太空、“科幻小说设置为“标题2,并为其添加工程符号.

9、D:Tntwrc£11des.htal(XHTKL)*5Q.而二回二ZW；3QQ.舞仁丽二顿二国厂5W丽二I6M7西UJLHILd.IdILIII*I,11ILILJI.1"1一IIJIkJJULiI1.JL*ILLLd1L1ILdIkJIHikJL1二1I.d1LH.IL*IdIL_ILI,dILILdIkUll-JIRl!IkJIkJI我1门对未未充满美巧的祝愿,节望将充群鸟却超音速飞机比翌齐飞,天空澄数蔚盛空气洁浮清新,大窗共享簿册J一切都井然心序.年当人口省.这息TPMJfc郢式的空想.也是如果我们都崩笈T方向野力的诘.寸弦势假设靛启RT能受应谦史.让最灯一急幡根术

10、来研.欧为首工标题3标的K预先格式化的认收藏陵系我们网站治理格式版蒂字体号评样式无中像素3*'V工BZSSMW4RRliE：E择接目标向面屈性.|(3)将“设为首页、“参加收藏、“联系我们、“网站治理设置为“标题5.(4)将最后4行文本的对齐方式设置为“居中(5)将最后3行文本的颜色设置为灰色(#999999).D:futurtindex.ht*l(KHTSL)*回回冈100i150ii11IiiiEiimiI250,300hii11ii11111iiii1111111111113S0rl400'.4aoi500-IIIIIIIIIIIIillIIIIIIIIIIIIIIIII

11、rIIo二-未来都市<divSTYLE1>我们对未来充满薨好的祝海,希望将来群鸟和超音速飞机比翼齐飞.天空澧谢葱蓝i空气港津清新,大冢共享绿地,1切都井城有序许假设AU力.4可能探一种启托邦式的军强,f日是如果薪们而朝他个方向塑力的话,班/背阴就有可空弯成翻妄.计我们一起畅想未来吧口未来旅游未来通讯.展望太空科幻小说设为首页I参加收或I帙泵表们I网站治理Copyr1gkt.?2007-20Cte衡想工作室/AllRightsReservedIL.W禽T1的效劳有任向意见或建设,话惠嘱E-mail茎t.«d<i4illJ：1:犷丁IL：；币史.：¥|四Q10

12、QN*717X350*1K/1秒3 .添加和删除中文字体(1)添加“隶书、“华文行楷等中文字体.默认字体亲,体期朱体ArialjHeliretie3hs-seiri£TimesHerSomaiTim已号患5erifCourierHe*_,Comrier?monoejjaceG包屯r&i驾TimgsH型畔上；口力亚Timas,serifGenevaArial,Helv*tici,sans-serif格式v像素0鼠v大小12字体(2)将“未来都市、“未来旅游、“未来通讯、“展望太空、“科幻小说5行文字的字体设置为华文行楷.(3)按F12,保存并预览网页.(二)在页面中插入和处理图

13、象1 .插入图象(1)在页面顶端插入图象(a)将光标置于页面左上角的起始处,然后按回车键,生成一个空行.(b)在菜单栏中选择"插入"一"图象"命令,找到素材文件夹webcoursechapter03images中的图象注意：要将其复制到站点的“images文件夹中.(c)用同样的方法,在第一段下面插入图象,效果如下列图所示.2 .调整图象“、“的对齐方式地图瓦O垂直逑距|自椁水平边距II帼乘折度谡边框时齐就仅值(2)使图象左对齐.方法同上.X索寿市上家热勒金.odv><p><im£>丁席住宽240高192地图I口.

14、弹垂直边距水平位距源文怦images/iiig3_2.俄报目标怅髀析度漉)裂霹鹦霸霸方中部*上层底组.0在对齐3 .调整图象“的周边间距选中图象“,按下列图设置图象的垂直边距和水平边距.'*家都审工束通他展望太空,科幻小说idr?Kimchi,厘畦-卜国琳,25K宽24.高192地图源文件口11£8冏&2,为3替换链接电白俄辑0区TL1目标对齐左对齐4 .为图象“添加提示文本：科幻图象方法：选中图象,在“属性面板的“替换文本框中输入“科幻图象,然后按回车键.按F12,保存并预览网页,效果如下列图所示.未来都布未来遹讯-展望太变科加短(三)插入水平线1 .在页面中插入水

15、平线(1)将插入点置于“设为首页文本前.(2)在菜单栏中选择“插入一“HTML-“水平线.2 .修改水平线将水平线设置成居中对齐、宽：920像素、高：5像素.如下列图所示.-350400450SOO550设为首页参加收聿,京束都布,I家旅潺*才"£彳4扈T太空科幻*优同站治理联系我们V714X436V2K/1电3.将水平线的颜色设置为蓝色(1)选中水平线.(2)单击“属性面板右侧的“快速标签编辑器中输入"color="#024918./按钮,翻开“快速标签编辑器,如下列图所示,在其<ir>j在.水平线.上未都市,1束弗潺.未遹辄,蔑望大交科幻

16、小就对齐居中对齐回阴能glor二'#.24编辑标釜.?比aligns'eenrer"wi-2CT(3)按F12键预览,可以看到水平线变为蓝色了.(四)插入特殊字符(Ctrl+Alt+c)1 .在页面页脚插入版权字符(1)删除页脚中的“？.(2)在菜单栏上选择“插入一“HTML一“特殊字符,从单出的子菜单中选择“版权.2 .改变栏目颜色将“未来都市、“未来旅游、“未来通讯、“展望太空、“科幻小说5行文本的颜色设置为与顶端“畅想未来10go相同的颜色.方法：先选中文本,然后在文本的“属性面板上单击“文本颜色按钮,拖动鼠标移动滴管到所要设置的颜色上单击即可,如下列图所示.朝

17、门用奇淤;方琳的后置帮蝴呻畸庞飞"m宵齐飞,舌例漕芭h,空羽瓣福rj大痂百事加,fwn；用百斤讦齿/,r/为谊同gTW茂簿式的至相,It士广；典中的隹.郅后lELit节司:K变造国要.It割JE蠢这米麦吧,角首KIHAHM.W4S91颗0时00画周Cu-rtinb.k°曰口？1如里优居讪E冬二住同四JkftgiAffraTu屈住格式标船27例v至此,本页面已完成,完成后的效果如下.口.一£未来把塞圣克安在主.多上声会典当把也京玉飞flttjl弄K色塞电安4,空r片中PSS人&与枭二.一汇型产博学学许步人认为.限是一*»耳拒苒f苴色刃.鱼是HJMM

18、7ii小才工费力魄塞.萋七第至代安胃亚空或5裔*ih*n一看番亍来左毛,.工彖葬率,X拿琳博*京拿通1*屐安大女.科七d钝当为首堂I*人世般IatstrI町雄空一四、实训总结(一)本实训介绍了利用Dreamweaver创立站点的方法1 .建立站点,首先要规划站点结构,然后创立站点.2 .其中重点介绍了利用“文件面板治理站点文件的方法.(二)制作一个简单的网页1 .设置页面属性2 .网页中的根本元素(1)在网页中编辑文本字体格式和段落格式(2)在网页中插入图片图片格式的设置(3)在网页中插入水平线水平线格式的设置(4)在网页中插入特殊字符作业下列图所示言ffl中文女同身In后抵团音驯&比利者的%A,都S为'音.播1誓再不,里面却.费尽廖够,筹干衽等肯了十年之后.对IT目己生萼惠口iZ-HhtfM3三H,但倬色工整型后着JHTJ&M*相信漳T珏襄长由嚣百百口射范神.核信息曲1件潺痔苒包尽民、苒耳11参照提供的作业结果,利用所给的素材文件,制作一个介绍台湾音乐团体“信乐团的网站,要求如下:1.在Dreamweave创立本地站点文件夹,将网页用到的素材按类别复制到站点文件夹中2.新建文件,设置页面背景图象为,网页标题为“信乐团3.插入根本页面元素,包括文本、图象、水平线和日期对象,效果如下列图所示这很辛苦.旧