1 / 14

第八单元 综合应用 ( 框架页面、定义样式、配色方案、 Fireworks/Flash 应用等 ) 8.1 第 1 题解答 1. 建立框架页面

第八单元 综合应用 ( 框架页面、定义样式、配色方案、 Fireworks/Flash 应用等 ) 8.1 第 1 题解答 1. 建立框架页面 第 1 步:将 Unit8Y8-01 目录复制到 root 目录中,重命名为 X8-01 。 第 2 步:启动 DM8 ,新建一个 类型的框架页面。 2. 命名框架 第 3 步:选择 “ 窗口 ” 菜单 “ 框架 ” ,打开框架 面板。如下。 架 IIS 运行 X8-01X8-01.asp 看运行结果。.

Télécharger la présentation

第八单元 综合应用 ( 框架页面、定义样式、配色方案、 Fireworks/Flash 应用等 ) 8.1 第 1 题解答 1. 建立框架页面

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. 第八单元 综合应用(框架页面、定义样式、配色方案、Fireworks/Flash应用等) 8.1 第1题解答 1. 建立框架页面 第1步:将Unit8\Y8-01目录复制到root目录中,重命名为X8-01。 第2步:启动DM8,新建一个 类型的框架页面。 2. 命名框架 第3步:选择“窗口” 菜单\“框架”,打开框架 面板。如下。 架IIS运行X8-01\X8-01.asp 看运行结果。 / 14

  2. 第4步:选择框架面板中左边的框架,在“属性”面板中将其命名为left,如下。第4步:选择框架面板中左边的框架,在“属性”面板中将其命名为left,如下。 第5步:重复第4步,分别将顶部框架命名为top,右边框架命名为main。 3. 设置框架 第6步:在框架面板中,单击框架的边缘选中框架组,在“属性”面板中选中顶部的top框架,设置“行”为115像素,如下: / 14

  3. 第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

  4. 6. 定义样式 第10步:光标停到top框架中,执行“窗口”菜单\“CSS样式”,在“CSS”面板中单击“新建样式”钮 。 第11步:在“新建CSS规则”对话框中如下设置,然后“确定”,如下所示: / 14

  5. 第12步:打开“tr的CSS规则定义”对话框,在“类型”分类中作如下设置:第12步:打开“tr的CSS规则定义”对话框,在“类型”分类中作如下设置: 第13步:重复第10-12步,在left框架页X8-01B.asp中,定义tr标签,其字体为宋体、9点数。 / 14

  6. 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

  7. / 14

  8. 第18步:在表格的单元格中输入文本“书香诗语”、“风中叶”、“告别校园”、“缘生缘灭”、“听雨”和“水中花”,其中“书香诗语”设为隶书,4号,白色。单元格高30像素,水平居中,垂直中间。单元格边框为白色,如下:第18步:在表格的单元格中输入文本“书香诗语”、“风中叶”、“告别校园”、“缘生缘灭”、“听雨”和“水中花”,其中“书香诗语”设为隶书,4号,白色。单元格高30像素,水平居中,垂直中间。单元格边框为白色,如下: / 14

  9. 第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. 10. Fireworks的运用 第20步:在Fireworks中打开X8-01\images\logo.gif文件,选择“文件”菜单 \“导出向导”,在 对话框中选择“选 择透明颜色”按 钮,鼠标将变成 “吸管”状,移动 鼠标到图像中选 择要设置为透明 的颜色,然后单 击对话框中的 “导出…”按钮, 将原文件覆盖 如右所示: 吸管点这里 / 14

  11. 第21步:同样方法,将X8-01\images\logo1.gif文件进行透明优化,结果如下:第21步:同样方法,将X8-01\images\logo1.gif文件进行透明优化,结果如下: / 14

  12. 11. Flash的运用 第22步:在top.asp页面中,将文本“Flash MX完全自学手册”删除,光标停在该单元格中,执行“插入”菜单\“媒体”\“Flash”,选择X8-01\images\ PageTitle.swf,确定,如下所示: / 14

  13. 12. 超级链接的建立与框架目标的指定 第23步:在left框架选择文本“风中叶”,设置其链接为WJ/Y8-01A.asp,目标窗口为main,如下所示: / 14

  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

More Related