网页开发工具实验六（网页布局）

《网页开发工具实验六（网页布局）》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、网页开发工具实验六：网页布局班级姓名学号一.实验目的1）掌握网页布局的儿种常见结构；2）拿握辅助工具标尺和网格的使用；3）熟练使用表格；4）掌握PHOTOSHOP切片和DW屮表格的结合使川;5）初步掌握层的概念和使用方法；6）初步使用框架建立网页布局。二.准备工作回顾教师课件笫六讲三.实验内容1.网页布局1）登录你喜欢的一个网诂，判断它的结构类空为:2）单击“查看”

2、“网格”

3、“显示网格”命令，使选项前出现“7”,文档中就会显示网格。选择“视图”

4、“网格”

5、“网格设置”对网格颜色和人小进行设置，观看效果。2.表格1）利用插入工具屮“插入表格”按

6、钮（在常用和布局选项卡屮都有）插入表格，利用属性面板中的合并单元格按蚀和拆分单元格按钮设计如下表格；音乐乐园流行音乐摇滚音乐古典音乐推荐歌曲歌曲名称试听12）将表格边框改为5个像素宽，蓝色；3）单击“查看”丨“表格模式”布局模式”命令，将从标准模式转换为布局模式；4）单击插入面板屮“布局”选项卡，选择“绘制布局单元格”按钮国，绘制如上表格。5）你喜欢用哪种方式创建表格？1.在DW屮建立一个新的站点（目录命名为某某某实验6-3）,打开文件夹（实验2-表格部分）中的”第四讲实例2•活动页而”文件渗照参考站点的页而效果，将第四讲屮制作的PS页面制作成

7、DW屮带有链接的网页。1）在图层面板小，找到活动按钮相对应的图层组（分别为flash、文章、图片、视频），进行复制组的复制，并将复制好的副本组改名为flash（大）、文章（大）、图片（大）、视频（大）。15®「厂图层Tftit、鶴轻、穿透v不透明度：ico%>活动首页视频作品flash作品图片作品文字作品■—JlX22E>P・WORLD发勢中华小Ml环球大主■畑片创作大U吧！►-J血“小）►-J立歎大）ONEDREAM*次淆勸由AKHK^NAe合发起•选取•天債・、•爱・、•薑朝•*的任■一个出・tfWifl汇■由组合作为・用P己的16■借盲後

8、■你&潑中豹•天««»»••►—S1片（2►—文SL（小）►_J困片（大）»_1导0C观烦:大）►—枫疑小）►一I司时优柏H络姐・■an・原创作品衣凤■祈煤体欄出擾中决賽.华VUifi・DVflIAiniB.价値8000元2尊奖・价值5ooo元8儒羹名MTM1B・价值3000元•与华绘环螺大葆中.豪有轨金受•出It香■云■・奈•见CF主卫凤KA姐3-3sOO1»««■投影100%0文B:2.59hV29.9M2）在按钮周围建立参考线（保证放人后的大小一致），在图层面板中选中各个大按钮所在图层组，点击编辑——变换——缩放，将按钮放大一些。他曲大）

9、文欽小〉册（大）因片（小）视殊小〉洁动区fflQ30•效果活动首页S1MOREMORE■动休的无尽創•场■能IH•主■烟片侧作大U吧ONEWORLDONEDREAM规频作品flash作品图片作品文字作品Q^z虽<3）便用切片工具，分别对上方的导航条和屮间的导航条进行切片。使用切片选择工具右击各个切片，编辑切片选项，在英中输入各个链接的URL（这些要链接的页血可以在DW中建立）。钱定：□y4-a▼-I展示I彌1尺寸W(W)：87H(H)：44文档：2.5$M/29.7MV）片送攻100%c六MJWKtAWW汇ns*中供.80(价值500价值300

10、XQ0:4G4Y(I)：14出休的电脑.ONEW(」•・、ZXJiTi-XAHRMZ島GA*•卜101B11「富—彳活动酋页融作品w>7▼L*1r■wuflash作品品MM1

11、oeq文字作品07E38KiZZOiHE遇泾

12、嫌G不»«»：10)%>an□□□:切片姿型（S）：►-JHash(大)►-Jflash(小)►-J文枣（大）►—文勲小）►—田片《大）4）然后将文件在imageready111进行编辑。打开WEB内容面板，为屮间的卩4个按钮切片添加翻转状态，并在图层中操作（正常状态显示小图标组，翻转状态显示大图标组）。编辑完毕后，直接在im

13、ageready屮选择“文件——存储优化结果”将文件保存成网页格式（要存在你的站点目录下）。

14、□企示5»ia弟四讲实例2活动页面.18詡转伏态詡转伏态第四讲实例2活动页面_23詡转伏态D」fesh（^）>—文章（大）ULJ文堂0、）1>—图片（大）卜_）图片（小）D-视频（大）k—视皴（巾）图层IONE■伽h（大）□verMORE（豪血助Bl■权记风电房决铢网站）F发起.送取•天使・、•爱•、m由ta合作为«m»k主艙•天使5）打开DW,在你的站点中选择刚才保存好的网页,按FF12进行预览。6）尝试制作其他要链接到的网页，让你的网诂具有一定的规

15、模。7）1.新建站点（命名为某某某实验6・4）,根据文件夹6・4参考效果图中的图片制作一个网页，要求导航有动态效果。完成后上传整个站点文件夹。加入你的