《网络广告设计实验指导书14624.docx》由会员分享,可在线阅读,更多相关《网络广告设计实验指导书14624.docx(36页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、实验指导书 目录实验大纲纲1实验一简简单网页页制作33实验二在在网页中中插入基基本元素素7实验三表表格的创创建与编编辑133实验四表格布布局(一一)188实验五表格布布局(二二)233实验六框框架与表表单277实验七 CSSS311实验八网网页制作作综合练练习36635教育传播技术学院教育技术学专业实验大纲纲课程名称称:网页设计计与制作作英文名称称:Desiign andd Maakinng oof WWebPPagees设置形式式:非独立设设课课程模块块:专业方向向课实验课性性质:专业实验验课程编号号:6018822课程负责责人:王丽萍大纲主撰撰人:王丽萍大纲审核核人:李焕勤一、学时时、学分
2、分课程总学学时:48实验学时时:16课程学分分:2二、适用用专业及及年级教育技术术学二年年级三、课程程目标与与基本要要求课程的目目标:课程全面面介绍网网页设计计与制作作的相关关知识,包包括网页页制作工工具Drreammweaaverr的使用用方法、HTML语言、CSS技术及网站的发布与维护等,目标是使学生具备网页设计与制作的基本知识和基本技能,能够独立完成中、小型网站的设计与制作,为将来制作网络教学软件和教育专题网站打下基础。基本要求求:1掌握握利用DDreaamweeaveer创建建网站、制制作网页页、管理理站点等等。2熟练练掌握文文字的各各种编排排方法。3熟练练掌握图图形的获获取、各各种修
3、饰饰方法。4熟练练掌握超超链接技技术。5熟练练掌握音音频、视视频等多多媒体信信息的嵌嵌入、链链接方法法;6熟练练掌握表表格的使使用方法法,会用用表格设设计网页页;7掌握握框架制制作网页页的方法法,会使使用框架架设计网网页;8掌握握制作表表单的方方法,会会利用表表单建立立交互式式页面;9掌握握HTMML的语语法结构构及各种种标记的的使用方方法;10掌掌握在网网页中添添加CSSS的方方法,会会使用CCSS设设置网页页格式和和网页布布局;11掌掌握站点点管理及及发布。四、主要要仪器设设备多媒体计计算机,安安装Drreammweaaverr、Firrewoorkss、Flaash、PhootoSSho
4、pp、CutteFTTP等软软件。五、实验验项目及及教学安安排序号实验项目目名称实验基本本方法和和内容项目学时时项目类型每组人数教学要求求1简单网页页制作Dreaamweeaveer软件件的操作作界面的认认识;建建立站点点;制作作简单网网页2基础1必修2在网页中中插入基基本元素素文本的插插入及属属性设置置;图像像的插入入及属性性设置;各种媒媒体的插插入及相相关参数数的设置置;建立立超链接接2基础1必修3表格的创创建与编编辑创建表格格;设置置表格的的属性;设置单单元格的的属性;制作特特殊表格格2基础1必修4表格布局局(一)利用表格格进行网网页布局局2基础1必修5表格布局局(二)利用表格格进行网网
5、页布局局2综合1必修6框架与表表单创建框架架;设置置框架集集的属性性;设置置框架的的属性;使用框框架面板板管理框框架;利利用框架架进行网网页布局局;插入表表单及表表单对象象;设置置表单元元素属性性2基础1必修7CSS创建CSSS样式式;使用用CSSS样式控控制网页页外观;编辑CCSS样样式2基础1必修8网页制作作综合练练习定位网站站的主题题和名称称;确定定网站的的栏目;确定网网站的目目录结构构;确定定网站的的链接结结构;设设计网站站的整体体风格;绘制网网页布局局;收集集制作素素材;网网站制作作;网站站上传。2设计综合1必修9自拟主题题网站制制作定位网站站的主题题和名称称;确定定网站的的栏目;确
6、定网网站的目目录结构构;确定定网站的的链接结结构;设设计网站站的整体体风格;绘制网网页布局局;网站站制作8设计综合1选修10动态网站站制作使用Jaavasscriipt、Aspp、数据据库等技技术制作作小型动动态网站站10设计综合1选修六、考核核方式及及成绩评评定考核方式式:1、实验验平时成成绩:(1)实实验考勤勤:每次次考勤分分出勤(2分);请假、迟到、早退(1分);旷课(0分)记分。(2)预预习报告告:要求求写明实实验目的的、主要要实验设设备名称称、实验验原理和和内容。分分优秀(4分)、良好(3分)、中等(2分)、及格(1分)和不及格(0分)记分。(3)实实验报告告:要求求写明实实验设备备
7、名称和和型号、实实验步骤骤、实验验分析及及注意事事项。分分优秀(4分)、良好(3分)、中等(2分)、及格(1分)和不及格(0分)记分。实验平时时成绩最最后折算算成1000分。2、平时时作业:根据作作品评定定成绩,满满分为1100分分3、实验验考试:上机考考试,满满分为1100分分。成绩评定定:总实验成成绩占本本课程成成绩的330%。总实验成成绩=实验平平时成绩绩200%+平平时上机机作业30%+实验验考试成成绩550%。七、实验验教科书书、参考考书1实验验教科书书网页设计计与制作作(讲义义),王王丽萍,20052实验验参考书书Dreaamweeaveer MMX 220044 完美美网页设设计
8、与制制作,姜姜楠,中中国青年年出版社社,20004年年实验一“满满立减”网网络广告告的制作作一、实验验目的1熟悉悉PHOOTOSSHOPP软件的的操作。2掌握握网络广广告的构构成要素素。4按要要求完成成一则网网络广告告的设计计。二、实验验内容设计一则则图片广广告,要要求显示示店铺的的活动:单笔订单单满 1100 元减 5 元,送5元店铺铺优惠券券。单笔订单单满 1180 元减 100 元,送100元店铺铺优惠券券。单笔订单单满 3300 元减 200 元,送100元店铺铺优惠券券。单笔订单单满 5500 元减 300 元,送200元店铺铺优惠券券。全场包邮邮支持淘金金币抵价价 1100金金币抵
9、价价1元,最最高可抵抵货价的的5% 三、操作作步骤1设置置背景颜颜色2创建建宽为9950像像素,高高度在3300-4500像素之之间3构造造广告的的页面,要要求有新新奇的创创意,并并能体现现出网络络广告的的主要内内容4提交交设计的的网络广广告效果果图5撰写写实验报报告四、实验验要求1给出出你设计计的网络络广告的的主要构构成要素素?2给出出此次实实验中你你设计的的网络广广告的主主要目标标?3阐述述你设计计的网络络广告的的创意。实验二在在网页中中插入基基本元素素一、实验验目的1掌握握文本的的插入方方法及属属性设置置方法。2掌握握图像的的插入方方法及属属性设置置方法。3掌握握各种媒媒体的插插入方法法
10、及相关关参数的的设置。二、实验验内容1制作作“何所所思”网网页。2制作作“动画画厨房”网页。3制作作“我爱爱北京”网网络站册册。4创建建“多媒媒体”站站点,并并制作以以下网页页:(1)插插入fllashh动画的的网页(2)插插入ReealPPlayyer播播放器的的网页(3)插插入Meediaa Pllayeer播放放器的网网页(4)插插入背景景音乐的的网页三、操作作步骤1制作作“何所所思”网网页。(1)在在硬盘根根目录下下新建文文件夹,命命名为tthinnkinng。(2)打打开thhinggingg文件夹夹,在其其中建立立子文件件夹,命命名为iimagges。(3)将将所有图图片素材材复制
11、到到imaagess文件夹夹中。(4)启启动Drreammweaaverr,使用用“站点点管理理站点新建站站点”命命令新建建“何所所思”站站点。(5)新新建网页页,保存存为inndexx.httm。(6)在在网页中中插入文文字,设设置标题题文字,在在文字中中插入空空格,分分段,换换行。(7)在在网页中中插入图图片,设设置图片片的对齐齐方式为为“右对对齐”。(8)保保存网页页,预览览。2制作作“动画画厨房”网网页(1)在在硬盘根根目录下下新建文文件夹,命命名为ddongghuaa。(2)打打开doonghhua文文件夹,将将图片ddongghuaa.jppg复制制到该文文件夹中中。(3)启启动F
12、iirewworkks,打打开doonghhua.jpgg图片,使使用切片片工具进进行切片片。(4)使使用“文文件导导出”命命令,导导出切片片和网页页,设置置如图所所示。(5)启启动Drreammweaaverr,打开开donnghuua.hhtm网网页,使使用“修修改页页面属性性”命令令,设置置网页背背景色为为黑色,上上边距为为0像素。3制作作“我爱爱北京”网网站相册册。(1)将将所有图图片素材材保存在在phooto文文件夹中中。(2)在在硬盘根根目录下下新建文文件夹,命命名为bbeijjingg。(3)启启动Drreammweaaverr,使用用“站点点管理理站点新建站站点”命命令新建建“
13、北京京”站点点,并指指定beeijiing文文件夹为为“北京京”站点点的本地地根文件件夹。(4)新新建网页页,使用用“命令令创建建网站相相册”命命令创建建相册,设设置如图图所示。(5)单单击确定定按钮,相相册创建建完成。(6)按按F122,预览览网页。(7)打打开硬盘盘上的bbeijjingg文件夹夹,查看看文件,其其中immgaees文件件夹保存存的是原原图片,thumbnails文件夹保存的是缩略图,pages文件夹保存的是相册分页,index.htm是网站相册首页。4创建建“多媒媒体”站站点,并并制作网网页。(1)在在硬盘根根目录下下新建文文件夹,命命名为ssitee。(2)打打开sii
14、te文文件夹,在在其中建建立子文文件夹,命命名为MMediia。(3)将将所有多多媒体素素材复制制到Meediaa文件夹夹中。(4)启启动Drreammweaaverr,使用用“站点点管理理站点新建站站点”命命令新建建“多媒媒体”站站点,并并指定ssitee文件夹夹为“多多媒体”站站点的本本地根文文件夹。设设置完毕毕后,文文件面板板如图所所示。(5)在在网页中中插入fflassh动画画新建网页页,保存存网页为为0011.httm。在在网页中中插入fflassh动画画yueedinng.sswf,设设置fllashh动画背背景透明明。(6)在在网页中中插入RReallPlaayerr播放器器新建
15、网页页,保存存网页为为0022.httm。在在网页中中插入AActiiveXX,在属属性面板板上设置置ClaassIID为CLSSID:CFCCDAAA03-8BEE4-111cff-B884B-00220AFFBBCCCFAA,宽3220像素素,高2280像像素,参参数设置置如图所所示。(7)在在网页中中插入MMediia PPlayyer播播放器11新建网页页,保存存网页为为0033.hhtm。在在网页中中插入AActiiveXX,在属属性面板板上设置置ClaassIID为CLSSID:22DD6F3112-BB0F6-11DD0-994ABB-00080CC74CC7E995,宽3220
16、像素素,高2280像像素,参参数设置置如图所所示。(8)在在网页中中插入MMediia PPlayyer播播放器22新建网页页,保存存网页为为0044.httm。在在网页中中插入AActiiveXX,在属属性面板板上设置置ClaassIID为CLSSID:6BFF52AA52-3394AA-111d3-B1553-000C004F779FAAA6,宽宽3200像素,高高2800像素,参参数设置置如图所所示。(9)在在网页中中插入背背景音乐乐新建网页页,保存存网页为为0055.httm。在在网页中中插入,在在弹出的的选择文文件对话话框中选选择bggmussic.midd。插件件的参数数设置如如图
17、所示示。四、思考考题1文本本分行和和分段落落的区别别。2在网网页中插插入特殊殊符号的的方法。3在网网页中插插入列表表、日期期、水平平线的方方法。4实现现图文混混排的方方法。5在网网页中插插入视频频的方法法。6在网网页中插插入音频频的方法法。实验三表表格的创创建与编编辑一、实验验目的1掌握握表格的的插入方方法。2掌握握表格属属性、单单元格属属性的设设置方法法。3深入入理解表表格背景景颜色、填填充、间间距、边边框、单单元格背背景颜色色等属性对网网页外观观的影响响。4掌握握各种特特殊表格格的制作作方法。二、实验验内容1插入入、编辑辑表格。2在网网页中制制作水平平细线和和垂直细细线。3在网网页中制制作
18、细线线表格。4在网网页中制制作双线线边框表表格。5在网网页中制制作圆角角表格。三、操作作步骤1建立立站点(1)在在硬盘根根目录下下新建文文件夹,命命名为ttablle。(2)在在tabble文文件夹中中新建子子文件夹夹,命名名为immagees。将将所有图图片素材材保存在在imaagess文件夹夹中。(3)启启动Drreammweaaverr,使用用“站点点管理理站点新建站站点”命命令新建建“表格格练习”站站点,并并指定ttablle文件件夹为“表表格练习习”站点点的本地地根文件件夹。2插入入、编辑辑表格(1)新新建网页页,保存存网页为为0011.httm。(2)插插入一个个3行3列的表表格,
19、表表格宽度度为3000像素素,边框框粗细为为1,单元元格边距距为0,单元元格间距距为0。(3)选选中表格格,设置置表格的的填充为为5,间距距6,边框框为8。(4)选选中表格格,设置置表格的的背景图图像为ggirll.giif。(5)选选中表格格,用鼠鼠标拖动动表格右右下角的的尺寸手手柄,将将表格加加大,观观察背景景图像在在表格中中的“平平铺”情情况。(6)选选中第一一行所有有单元格格,将它它们合并并。(7)选选中第二二行第一一个单元元格,将将它拆分分成两列列。(8)选选中所有有单元格格,设置置单元格格的背景景颜色为为绿色。3在网网页中制制作红色色水平细细线(1)新新建网页页,保存存网页为为00
20、22.httm。(2)插插入一个个1行1列的表表格,表表格宽度度为5000像素素,边框框粗细、单单元格边边距、单单元格间间距均为为“0”。(3)选选中表格格,设置置表格的的背景颜颜色为红红色。(4)设设置表格格的高度度为“11”像素素。(5)切切换至“代代码”视视图,删删除单元元格中的的“&nnbspp;”代代码。(6)保保存网页页,按FF12预预览。4在网网页中制制作绿色色垂直细细线(1)新新建网页页,保存存网页为为0033.httm。(2)插插入一个个1行1列的表表格,表表格宽度度为1像素,边边框粗细细、单元元格边距距、单元元格间距距均为“0”。(3)选选中表格格,设置置表格的的背景颜颜色
21、为绿绿色。(4)设设置表格格的高度度为“4400”像像素。(5)切切换至“代代码”视视图,删删除单元元格中的的“&nnbspp;”代代码。(6)保保存网页页,按FF12预预览。5在网网页中制制作黑色色细线表表格(1)新新建网页页,保存存网页为为0044.httm。(2)插插入一个个3行3列的表表格,表表格宽度度为3000像素素,边框框粗细为为0,单元元格边距距为5,单元元格间距距为1。(3)选选中表格格,设置置表格的的背景颜颜色为黑黑色。(4)选选中所有有单元格格,设置置单元格格的背景景颜色为为白色。(6)保保存网页页,按FF12预预览。6在网网页中制制作双细细线表格格(1)新新建网页页,保存
22、存网页为为0055.httm。(2)在在网页中中制作细细线表格格,表格格宽度3300像像素,如如图所示示。(3)接接下来绘绘制另一一个表格格,1行1列,宽宽度3000像素素,单元元格边距距为2、单元元格间距距为1。表格格背景颜颜色为#00333666,单元元格背景景颜色为为白色。如如图所示示。(4)将将前面制制作的表表格复制制到该表表格中。如如图所示示。(5)保保存网页页,按FF12预预览。7在网网页中制制作圆角角表格(1)新新建网页页,保存存网页为为0066.httm。(2)在在网页中中插入一一个1行3列的表表格,表表格宽度度为3000像素素,边框框粗细、单元格边距、单元格间距均为“0”。设
23、置第一个单元格宽度9像素,高度9像素,在其中插入图片corner_tl.gif。设置第二个单元格高度为9像素,在其中插入图片topline.gif,设置图片宽度为282像素。设置第三个单元格宽度9像素,高度9像素,在其中插入图片corner_tr.gif。如图所示。(3)将将光标停停在第一一个表格格后,插插入一个个1行3列的表表格,表表格宽度度为3000像素素,边框框粗细、单单元格边边距、单单元格间间距均为为“0”。设设置表格格高度为为1000像素。设设置第一一个单元元格宽度度1像素,背背景颜色色为#FFF66600, 切换换至“代代码”视视图,删删除其中中的“&nbssp;”代代码。设设置第
24、二二个单元元格宽度度为2998像素素。设置置第三个个单元格格宽度11像素,背背景颜色色为#FFF66600, 切换换至“代代码”视视图,删删除其中中的“&nbssp;”代代码。(4)将将光标停停在第二二个表格格后,插插入一个个1行3列的表表格,表表格宽度度为3000像素素,边框框粗细、单单元格边边距、单单元格间间距均为为“0”。设设置第一一个单元元格宽度度9像素,高高度9像素,在在其中插插入图片片corrnerr_bl.ggif。设设置第二二个单元元格高度度为9像素,在在其中插插入图片片botttommlinne.ggif,设设置图片片宽度为为2822像素。设设置第三三个单元元格宽度度9像素,
25、高高度9像素,在在其中插插入图片片corrnerr_brr.giif。(5)保保存网页页,按FF12预预览。四、思考考题1图像像插入到到单元格格中与图图像作单单元格背背景有什什么区别别?2水平平细线的的制作方方法。3细线线表格的的制作方方法。实验四表格布布局(一一)一、实验验目的1掌握握利用表表格进行行网页布布局的方方法。2深入入理解表表格背景景颜色、填填充、间间距、边边框、单单元格背背景颜色色等属性对网网页外观观的影响响。二、实验验内容1制作作“网达达新闻”网网页。2制作作“心灵灵之间信”网网页。三、操作作步骤1制作作“网达达新闻”网网页。(1)在在D盘上新新建文件件夹,命命名为“wangd
26、a”。将images文件夹拷贝到该文件夹下。启动Dreamweaver,定义该文件夹为站点。(2)设设置页属属性字号:99pt网页背景景图片:bk.jpgg左、上边边距:00、0网页标题题:网达达新闻(3)插插入taablee1表格宽度度7788px11行2列表格背景景图片:imaage_04.jpgg宽4ppx高高48ppx插入图片片:immagee_022.jppg iimagge_006.jjpg(4)插插入taablee2表格宽度度7788px11行1列插入fllashh(5)插插入taablee3表格宽度度7788px11行1列插入图片片:seeek_01.jpggseeek_008
27、.jjpg(6)插插入taablee4表格宽度度7788px11行5列表格背景景颜色:白色各列宽度度:199913722120557788中间列单单元格的的背景图图片:iimagge_119.jjpg(7)插插入taablee5表格宽度度7788px11行1列表格背景景图片:imaage_31.jpgg(8)插插入taablee6表格宽度度7788px11行1列表格背景景图片:imaage_35.jpgg(9)制制作其它它内容(10)保保存网页页,按FF12预预览,如如图所示示。2制作作“心灵灵之间信”网网页。(1)在在D盘上新新建文件件夹,命命名为“xinling”。将images文件夹拷贝
28、到该文件夹下。启动Dreamweaver,定义该文件夹为站点。(2)设设置页面面属性网页标题题:心灵灵之间(3)制制作网页页网页布局局:宽度度7000像素,在在浏览器器窗口中中“居中中”图片一:imaagessimmg_22.giif 宽度2229像素素高度2881像素素图片二:imaagesstoop_ttextt.giif图片三:imaagessxiin_xxiaoo.giif图片四:imaagess iimg_botttomm.giif宽度度2244像素高度度62像素素网页导航航:表格格宽度1125像像素单元元格宽度度25像素素文字字上制作作空链接接(4)设设置网页页CSSS样式字号9p
29、pt行高 1150%A:liink COLLOR: #55c6cc81 TTEXTT-DEECORRATIION: nooneA:hooverr COLLOR: #00000000 TEXXT-DDECOORATTIONN: uundeerliineA:acctivve COLLOR: #00000000 TEXXT-DDECOORATTIONN: uundeerliineA:viisitted COLLOR: #55c6cc81 TTEXTT-DEECORRATIION: noone(5)保保存网页页,按FF12预预览,如如图所示示。四、思考考题1表格格宽度的的单位有有哪些。2一般般情况下下
30、,如何何设置布布局表格格的边框框、单元元格边距距和单元元格间距距。3一般般情况下下,如何何设置布布局表格格的高度度。实验五表格布布局(二二)一、实验验目的熟练掌握握利用表表格进行行网页布布局的方方法。二、实验验内容制作“我我的设计计”网站中中的“三维作作品”栏目。三、操作作步骤1建立立站点在D盘根根目录下下新建文文件夹,命命名为ddesiign。将将两个素素材文件件夹3ddimgg和imaagess复制到到dessignn文件夹夹中。启启动Drreammweaaverr,将deesiggn文件件夹定义义为“我的设设计”站点。2制作作“三维作作品”页面(1)新新建网页页,保存存为3dd_0001
31、.hhtm。(2)设设置页面面属性,如如图所示示。(3)插插入黑色色细线表表格。表表格大小小设置如如图所示示。在属性面面板上设设置表格格背景色色为黑色色,单元元格背景景色为#CCCCCB88,如图图所示。(4)将将光标置置于细线线表格中中,继续续插入表表格。表表格1行3列,宽宽度9000像素素,边框框、边距距、间距距均为00,高度度1200像素,背背景颜色色#9EE9E77E。各各列宽度度为300像素,3350像像素,5520像像素。插插入图像像后,如如图所示示。(5)将将光标置置于上一一表格后后,继续续插入表表格。表表格1行1列,宽宽度9000像素素,边框框、边距距、间距距均为00,高度度2
32、0像素素,背景景图像为为inddex_0044.giif。(6)将将光标置置于于上上一表格格后,继继续插入入表格。表表格1行3列,宽宽度9000像素素,边框框、边距距、间距距均为00。各列列宽度为为2000像素,550像素素,6550像素素。在左左列单元元格中插插入表格格及网页页内容,如如图所示示。(7)在在右列单单元格中中插入表表格及导导航图片片,如图图所示。(8)继继续插入入表格。表表格2行1列,宽宽度6000像素素,边框框、边距距、间距距均为00。第一一行单元元格高度度为100像素。在在第二行行单元格格中插入入表格,表表格1行3列,宽宽度6000像素素,边框框、边距距为0,间距为为10,
33、背背景颜色色为#BB7B77A5。各列列宽度为为1000像素,1100像像素,3360像像素,如如图所示示。(9)选选中上面面表格并并复制,然然后粘帖帖五次,如如图所示示。(10)在在表格中中插入图图片及内内容,如如图所示示。3制作作3d作品品的其它它页面四、思考考题1多层层表格嵌嵌套时,选选择表格格的技巧巧。2单元元格间距距和单元元格边距距对表格格布局的的影响。3单元元格对齐齐属性对对表格布布局的影影响。实验六框框架与表表单一、实验验目的1掌握握框架的的创建方方法。2掌握握框架集集和框架架的属性性设置方方法。3掌握握框架布布局的方方法。4掌握握插入表表单对象象的方法法。5掌握握表单对对象的属
34、属性设置置方法二、实验验内容1制作作“跳舞舞的树”网网页。2制作作“用户户注册”网网页。三、操作作步骤(一)制制作“跳跳舞的树树”网页页。1创建建框架网网页(1)定定义站点点,新建建网页。(2)勾勾选“查查看/可视化化助理/框架边边框”选选项,显显示“框框架边框框”。(3)用用鼠标拖拖动“设设计”视视图四周周显示的的框架边边框线,创创建框架架。2设置置框架集集和框架架属性(1)打打开“框框架面板板”。(2)选选择框架架集,设设置框架架集属性性。(3)选选择左框框架,设设置框架架属性。(3)选选择中间间框架,设设置框架架属性。(3)选选择右框框架,设设置框架架属性。3保存存框架集集和框架架选择主
35、菜菜单“文文件保保存全部部”命令令。4在框框架中创创建超链链接选中“首首页”,创创建到mmidddle.htmm文件的的超链接接,并为为链接指指定目标标框架窗窗口为mmidddle。选中“首首页”,创创建到mmidddle.htmm文件的的超链接接,并为为链接指指定目标标框架窗窗口为mmidddle。选中“有有树如我我”,创创建到llikeetreee.hhtm文文件的超超链接,并并为链接接指定目目标框架架窗口为为midddlee。选中“流流年”,创创建到llikeetreee.hhtm文文件的超超链接,并并为链接接指定目目标框架架窗口为为midddlee。选中“伙伙伴”,创创建到ccompp
36、anyy.httm文件件的超链链接,并并为链接接指定目目标框架架窗口为为midddlee。选中“翻翻箱倒框框”,创创建到ffavoo.httm文件件的超链链接,并并为链接接指定目目标框架架窗口为为midddlee。5保存存网页,预预览。(二)制制作“用用户注册册”网页页。1插入入表单。2插入入表单对对象。3设置置表单对对象属性性。四、思考考题1框架架结构的的组成。2框架架结构的的网页,网网页标题题如何设设置设置置。3单选选按钮和和复选框框对象的的属性设设置有何何不同。实验七 CSSS网页布布局一、实验验目的1掌握握在网页页中应用用CSSS的方法法。2掌握握CSSS基本语语法。3熟悉悉CSSS属
37、性。4掌握握使用CCSS布布局网页页的方法法。二、实验验内容1为“网网达公司司”网页页添加CCSS样样式。2为“心心灵之间间”网页页添加CCSS样样式。3使用用CSSS实现“wwebqquesst”网网页布局局。4使用用CSSS实现“固固定宽度度两栏”网网页布局局。5使用用CSSS实现“满满屏三栏栏”网页页布局。三、操作作步骤1为“网网达公司司”网页页添加CCSS样样式。(1)新新建样式式,重新新定义bbodyy标签,将将样式保保存在外外部文件件styyle.csss中。boody标标签的样样式定义义为:文文字9ppt,行行高1550%。(2)新新建样式式,重新新定义ttd标签签。tdd标签的
38、的样式定定义为:文字99pt,行行高1550%。(3)新新建样式式,重新新定义超超链接样样式。(4)新新建样式式,自定定义一个个类,用用于设置置文字为为白色。2为“心心灵之间间”网页页添加CCSS样样式。复制sttylee.csss文件件至“心心灵之间间”文件件夹。打打开inndexx.httm,并并链接外外部样式式表文件件styyle.csss。3使用用CSSS实现“wwebqquesst”网网页布局局。(1)查查看weebquuestt网页结结构,分分为coontaaineer,heaaderr,conntennt,foooterr几个部部分。(2)定定义boody样样式。(3)定定义#c
39、conttainner样样式(宽宽度为7760像像素,居居中)。(4)定定义#hheadder样样式。(5)定定义#cconttentt样式(宽宽度为7700像像素,居居中)。(6)定定义#ffootter样样式。(7)定定义其它它样式。4使用用CSSS实现“固固定宽度度两栏”网网页布局局。(1)查查看网页页结构,分分为ouuterr,boddybllockk,hdrr,barr,l-ccol,connt,ftrr几个部分分。(2)定定义boody样样式。(3)定定义#oouteer样式式。(4)定定义#bbodyybloock样样式。(5)定定义#hhdr样样式。(6)定定义#bbar样样式
40、。(7)定定义#ll-cool样式式。(8)定定义#ccontt样式。(9)定定义#fftr样样式。(10)定定义其它它样式。5使用用CSSS实现“满满屏三栏栏”网页页布局。(1)查查看网页页结构,分分为hddr,lh-cool,rh-coll,c-cool,ftrr几个部部分。(2)定定义boody样样式。(3)定定义#hhdr样样式。(4)定定义#llh-ccol样样式。(5)定定义#rrh-ccol样样式。(6)定定义#cc-cool样式式。(7)定定义#fftr样样式。(8)定定义其它它样式。四、思考考题1在网网页上应应用CSSS的四四种基本本方法。2类选选择符与与ID选择择符的区区别
41、。3使用用伪类时时的注意意事项。4CSSS盒模模型中各各参数的的对网页页布局的的影响。实验八网网页制作作综合练练习一、实验验目的1综合合运用网网页制作作的知识识和技术术制作网网站。2掌握握发布网网站的方方法。二、实验验内容1以“祖祖国腾飞飞”为主主题,制制作一个个网站。网网站包括括810张网网页,主主要内容容为“申申奥成功功”、“加加入世贸贸组织”、“载人飞船发射成功”、“澳门回归”、“战胜非典”等。2发布布网站。三、实验验指导1网站站制作(1)定定位网站站的主题题和名称称;(2)确确定网站站的栏目目;(3)确确定网站站的目录录结构;(4)确确定网站站的链接接结构;(5)设设计网站站的整体体风
42、格;(6)绘绘制网页页布局;(7)收收集制作作素材;(8)网网站制作作。2上传传网站(1)申申请免费费个人主主页空间间;(2)使使用FTTP工具具登录主主页空间间(推荐荐使用的的工具是是CutteFTTP);(3)输输入用户户名和密密码;(4)上上传文件件。四、思考考题1如何何建立合合理的网网站结构构?2网站站制作过过程中,使使用了哪哪种方法法进行网网页布局局,为什什么?3如何何更新发发布了的的网站。11.21.202204:3504:35:1922.11.214时35分4时35分19秒11月. 21, 2221 十一月 20224:35:19 上午04:35:192022年11月21日星期一04:35:19