网页的定位技术以及制作层动画.docxVIP

网页设计与制作实验报告 实验名称：网页的定位技术以及制作层动画 实验学时： 6学时 班 级： 学 号： 姓 名： 指导教师: 实验时间: 一、 实验目的和要求 1?掌握表格创建和编辑的方法 掌握布局表格和布局单元格的使用方法 掌握层的创建、编辑和应用的方法 掌握框架网页的创建、编辑和保存的方法 二、 实验内容及步骤 1.表格的创建、插入、删除、复制和移动等操作 创建一个名为exel4-l.htm的网页文件，将其保存到My site文件屮。在页 面上插入一个4行5列的表格，表格宽度为500像素，边框为1像素，在表格中 输入相应的内容。并在表格上方增加标题“信息学院各班平均成绩”，标题格式 为方正舒体、5号、粗体、#003366o 在表格“01级3班”上方插入一行,内容为“01级2班、85、82、88、82”。 在表格中“计算机组成实验”列前插入一列,内容为“计算机组成、69、73、75、 80”；将00级1班这一行移到表格的最后一行，删除“英语精读”这一列，预览、 观察效果后保存文件(接下来的实验中会用到)。 2?单元格的拆分、合并和格式化操作 以1中创建的表格为慕础，将表格中的数据全部居中；使整个表格在页而 屮居屮。 以年级为依据将表格拆分成两个表格，将01级表格的“科目”一行复制到 00级表格上方，使之成为00级表格的第一行，为00级表格添加标题一一“信 息学院00级平均成绩表”，然后删除00级表格的“科目”这一列。 将01级表格的“计算机组成”和“计算机组成实验”两个单元格合并成一 个单元格，内容改为“计算机组成和实验”、居屮、黑体、5号。 删除01级和00级两个表格的标题，然后分别套用系统预设的格式Simple3、 Simple lo 3 ?导入外部数据和表格排序 通过实验指导教程\chl4\material路径找到并打开Excel文件value.xls, 另存为My site\ value.csv文件，数据的分隔符是逗号类型。 在My site文件中新建名为exel4-2.htm的网页文件，对该文件进行如下 操作：将背景图片为My site \jpg\bg0015. jpg,导入数据文件value, csv. 通过【命令】一＞【排序表格】将表格按“合计值”列降序排序，合并表格 标题所在的单元格，并使标题居中；将表格【边框】设为3；【边框颜色】设为 #FF0000o 布局表格和布局单元格的应用 在My site文件夹中创建一个名为exel4-3.htm的网页文件，网页背景图 片文件为My site\ gif \bg0052.gif,创建一个3行5列的表格，用600*360 像素的布局表格布局，布局每个单元格为120*120像素。 根据实验效果图要求(图略)进行以下操作：通过【页面属性】一＞【背景 颜色】分别设置布局单元格的颜色为UCCCC99、#FF9900；通过【页面属性】一＞ 【背景图片】在布局单元格中分别插入My sitc\jpg文件夹中的名为 tul.jpg、 、tu7. jpg的图片。预览页面后，保存该文件。 层的基本操作 创建一个名为exel4-4. htm的网页文件,并将其保存到My site文件中。 通过【页面属性】将页面背景设为My site \ gif\bg0052.gif。 通过【插入】一＞【布局对彖】-＞【层】，在网页合适的位置上，分别创建 名为source和shadow的层，层的尺寸为550*70像素，Z-index的值分别为2 和1。 在两个层中均输入文字“书一人牛的伴侣，知识的源泉”，在属性面板中， 将文字颜色分别为红色和黑色，字体及大小自行定义。移动层，使两个层略微错 开重叠，使文字带有阴影效果。 打开【层】浮动面板，选中【防止重叠】复选框，然后移动名为source 的层，试更改前后的区别。 完成激活层、选中层、改变层的大小、改变层的可见性等操作，并观察效 果。 改变这两个层的叠放次序，使名为source的层成为shadow层的子层，观 察改变后的效果，然后恢复原样。 层与表格的综合练习 创建名为exel4-5.htm的网页文件，将其保存到My site文件夹中。设置 背景图片为My site \jpg\bg0006. gifo在网页合适的位置上插入1行4列的表 格。表格的各项参数为【宽】为360像素、【高】为30像素、【背景颜色】为ttFFFFEE. 【边框颜色】为#99CCCC、【边框】为2像素、【填充】为0、【间距】为0。 在4个单元格中分别输入“现代生活”、“生活艺术”、“文化教育”、“科学 技术”。 在网页合适的位置上插上4个层，层的大小均为90*90像素,在每个层中 插入一个4行1列的表格，每个单元格的大小分别为90*22像素，选中表格，在 属性面板中设置表格【边框】为1像素、