140 likes | 253 Vues
第八单元 综合应用 ( 框架页面、定义样式、配色方案、 Fireworks/Flash 应用等 ) 8.1 第 1 题解答 1. 建立框架页面 第 1 步:将 Unit8Y8-01 目录复制到 root 目录中,重命名为 X8-01 。 第 2 步:启动 DM8 ,新建一个 类型的框架页面。 2. 命名框架 第 3 步:选择 “ 窗口 ” 菜单 “ 框架 ” ,打开框架 面板。如下。 架 IIS 运行 X8-01X8-01.asp 看运行结果。.
E N D
第八单元 综合应用(框架页面、定义样式、配色方案、Fireworks/Flash应用等) 8.1 第1题解答 1. 建立框架页面 第1步:将Unit8\Y8-01目录复制到root目录中,重命名为X8-01。 第2步:启动DM8,新建一个 类型的框架页面。 2. 命名框架 第3步:选择“窗口” 菜单\“框架”,打开框架 面板。如下。 架IIS运行X8-01\X8-01.asp 看运行结果。 / 14
第4步:选择框架面板中左边的框架,在“属性”面板中将其命名为left,如下。第4步:选择框架面板中左边的框架,在“属性”面板中将其命名为left,如下。 第5步:重复第4步,分别将顶部框架命名为top,右边框架命名为main。 3. 设置框架 第6步:在框架面板中,单击框架的边缘选中框架组,在“属性”面板中选中顶部的top框架,设置“行”为115像素,如下: / 14
第7步:重复第6步,选中下部的left和main框架集,在属性面板中将left框架的“列”设置为90像素,如下:第7步:重复第6步,选中下部的left和main框架集,在属性面板中将left框架的“列”设置为90像素,如下: 4. 保存框架页文件 第8步:执行“文件”菜单\“保存框架页”,在“保存为”对话框的“保存类型”处选择Active Server Page(*.asp)项,将文件保存到X8-01\x8-01.asp。 5. 保存框架文件 第9步:鼠标分别停留在top、left、main框架中,执行“文件”菜单\“保存框架”,将三个框架分别保存为X8-01A.asp、X8-01B.asp、X8-01C.asp。 / 14
6. 定义样式 第10步:光标停到top框架中,执行“窗口”菜单\“CSS样式”,在“CSS”面板中单击“新建样式”钮 。 第11步:在“新建CSS规则”对话框中如下设置,然后“确定”,如下所示: / 14
第12步:打开“tr的CSS规则定义”对话框,在“类型”分类中作如下设置:第12步:打开“tr的CSS规则定义”对话框,在“类型”分类中作如下设置: 第13步:重复第10-12步,在left框架页X8-01B.asp中,定义tr标签,其字体为宋体、9点数。 / 14
7. 使用配色方案 第14步:光标停到X8-01A.asp框架中,执行“修改”菜单\“页面属性”,设置类型、背景等。(注:Dreamweaver MX中“配色方案”在“命令”菜单下。) 第15步:重复第14步,对X8-01B.asp执行相同操作。 8. 设置页面属性 第16步:光标到left框架中,在“页面属性”对话框中设置“标题”、“左边界”、“边界宽度”、背景色为#FFCC00、文本色为#669966。 9. 填充页面 第17步:在X8-01B.asp页面中,插入(6×1)、宽度为100%的表格。在“属性”面板中设置的边框颜色为#009900,如下图所示: / 14
第18步:在表格的单元格中输入文本“书香诗语”、“风中叶”、“告别校园”、“缘生缘灭”、“听雨”和“水中花”,其中“书香诗语”设为隶书,4号,白色。单元格高30像素,水平居中,垂直中间。单元格边框为白色,如下:第18步:在表格的单元格中输入文本“书香诗语”、“风中叶”、“告别校园”、“缘生缘灭”、“听雨”和“水中花”,其中“书香诗语”设为隶书,4号,白色。单元格高30像素,水平居中,垂直中间。单元格边框为白色,如下: / 14
第19步:按下Alt键同时单击top框架,在属性面板中将对X8-01A.asp页面的链接修改为WJ/top.asp,在出现的提示中选“是”,将改动保存到X8-01A.asp页面,如下:第19步:按下Alt键同时单击top框架,在属性面板中将对X8-01A.asp页面的链接修改为WJ/top.asp,在出现的提示中选“是”,将改动保存到X8-01A.asp页面,如下: / 14
10. Fireworks的运用 第20步:在Fireworks中打开X8-01\images\logo.gif文件,选择“文件”菜单 \“导出向导”,在 对话框中选择“选 择透明颜色”按 钮,鼠标将变成 “吸管”状,移动 鼠标到图像中选 择要设置为透明 的颜色,然后单 击对话框中的 “导出…”按钮, 将原文件覆盖 如右所示: 吸管点这里 / 14
第21步:同样方法,将X8-01\images\logo1.gif文件进行透明优化,结果如下:第21步:同样方法,将X8-01\images\logo1.gif文件进行透明优化,结果如下: / 14
11. Flash的运用 第22步:在top.asp页面中,将文本“Flash MX完全自学手册”删除,光标停在该单元格中,执行“插入”菜单\“媒体”\“Flash”,选择X8-01\images\ PageTitle.swf,确定,如下所示: / 14
12. 超级链接的建立与框架目标的指定 第23步:在left框架选择文本“风中叶”,设置其链接为WJ/Y8-01A.asp,目标窗口为main,如下所示: / 14
第24步:重复第23步,分别设置“告别校园”链接为WJ/Y8-01B.asp,“缘生缘灭”链接为WJ/Y8-01C.asp,“听雨”链接为WJ/Y8-01D.asp,“水中花”链接为WJ/Y8-01E.asp,目标窗口均为main。第24步:重复第23步,分别设置“告别校园”链接为WJ/Y8-01B.asp,“缘生缘灭”链接为WJ/Y8-01C.asp,“听雨”链接为WJ/Y8-01D.asp,“水中花”链接为WJ/Y8-01E.asp,目标窗口均为main。 13. 框架源文件的指定 第25步:按下 Alt键同时点main 框架,在属性面板 中设置其链接为 WJ/Y8-01A.asp, 保存。最终结果 如右: / 14