下载文档原格式
《网页设计与制作》课程标准序言：《网页设计与制作》是理实一体化课程，是计算机专业（软件与信息服务、数字媒体、计算机应用专业）的一门重要的专业必修课。
本课程定位于WEB技术开发工作岗位。
它是WEB前端技术开发的必备课程，在整个课程系统中拥有重要的作用，一、课程的说明：经过本课程的学习，使学生认识网页设计技术的发源和发展、常用的网页制作软件及HTML语言，掌握运用Dreamweaver（以下简称DW）网页制作软件制作网页的方法，经过运用Photoshop图像办理软件和Flash动画制作软件，三个软件相互当合，达成网页设计与制作任务的方法。
为此后从事网页设计与制作、网站开发和管理确立基础。
在网页设计的实践中要点培育团队协作、交流交流能力，培育自主学习能力和探究创新能力。
二、课程内容与基本要求：该课程波及的知识是网页设计人员必备的基本技术，职业活动与课程内容的对应关系以下：三、教课目的1、职业要点能力目标(1) 掌握使用Photoshop进行图像办理的基本方法及操作技术(2) 掌握DreamweaverCS5的基本知识及操作技术(3) 掌握成立与管理站点的方法(4) 掌握制作主要内容为文本的网页的方法(5) 掌握在网页中插入与编写图像的方法(6) 掌握在网页中插入多媒体元素的方法(7) 掌握表格办理与网页布局的方法(8) 掌握创立超级链接的方法(9) 掌握使用框架制作旅行网站的方法(10) 掌握创立和使用模板的方法(11) 掌握创立和使用库的方法(12) 掌握在网页中增添AP Div的方法(13) 掌握在网页中使用行为的方法(14) 掌握HTML基础知识及经过代码修饰网页的方法(15) 掌握使用CSS款式表修饰网页的方法(16) 掌握动向网页的观点及简单动向网页的制作方法2、职业特意能力目标(1) 经过达成有关的项目，掌握网页设计的基本工作流程。
(2) 经过达成有关的项目，掌握网页设计常用工具的使用方法。
第13章 CSS的属性和值一、CSS字体属性1、字体集合(font-family)可以用一个指定的字体名或一个种类的字体集合。
多个集合的赋值是可以使用的，而如果确定了一个指定的字体赋值，就应该有一个种类集合名随后，以防第1个选择不存在。
定义一个字体的集合的时候，就相当于定义了一个字体的控制集合，当浏览器解释执行的时候，会控制集合中所列的字体顺序从前到后的选择字体。
任何包含空格的字体名都必须用单引号引住。
字体集合也可以用字体属性给出。
案例名称：字体集合 l2-1.htm<html><head><title>字体集合</title><style type="text/css">p{font-family:"隶书",times,serif}</style></head><body><p>字体集合</p><p>text/css</p></body></html>■CSS字体■2002:7:25 ·eva(原创)■ FONT-FAMILY属性：每部机器上都装有多种字体，浏览器会使用默认的字体浏览网页，比如简体中文版WINDOWS汉字默认是宋体，英文默认是ARIAL。
使用FONT-FAMILY属性则可以规定浏览器用什么字体解读网页。
■ FONT-FAMILY语法实例：h2 {font-family:times,impact,sans-serif}说明如下:helvetica是浏览器首先寻找的字体名称，如果有就使用它。
在helvetica字体没有找到的情况下，则会寻找impact字体，如果找到就使用它。
如果以上两种字体都没有找到，则指示浏览使用sans-serif（通用字体）。
在你不能保证你列出的字体浏览者一定会安装时，将一种通用字体加在字体列表中是一种好的做法。
第13章网页编辑与超链接13.1 网页文档的格式化13.1.1用HTML标记格式化文本图13-1 HTML标记格式化文本13.1.2用HTML样式格式化文本·266··267·图13-2 HTML 样式面板图13-3 【定义HTML 样式】对话框13.2 网页图像编辑的基本操作13.2.1 创建鼠标经过图像新建样式删除样式HTML 样式列表自动应用 应用按钮图13-4 【插入鼠标经过图像】对话框13.2.2 建立网站相册图13-5 【创建网站相册】对话框13.2.3利用外部编辑器编辑图像·268·图13-6 【查找源】对话框图13-7 修改前的图片图13-8 修改后的图片图13-9 Fireworks MX位图编辑状态（a）将“东风楼”及阴影擦除（b）改变图片的底色（c）图片出现边框线条（d）设置参数后的效果图13-10 图片编辑过程·269·图13-11 图片的属性面板图13-12 效果参数设置图13-13 图片的属性面板13.3创建超链接13.3.1超链接概述13.3.2创建超链接的方法图13-14 属性面板·270·图13-15 利用【指向文件】按钮创建超链接13.3.3创建锚点链接图13-16 插入【命名锚记】对话框13.3.4创建E-mail链接图13-17 电子邮件链接对话框·271··272·图13-18 在属性面板中设置E-mail 链接13.3.5 创建导航条图13-19 插入导航条对话框13.3.6 创建跳转菜单图13-20 插入跳转菜单对话框图13-21 带跳转按钮的跳转菜单图13-22 跳转菜单的属性面板图13-23 【列表值】对话框·273·图13-24 设计浮动面板组图13-25 跳转菜单对话框13.3.7创建映射图链接图13-26 图像的属性面板·274·图13-27 定义映射图热点区域13.4 应用实例例13.3制作具有下列要求的网页，如图13-28所示。
网页设计与制作报告（优秀3篇）（经典版）编制人：__________________审核人：__________________审批人：__________________编制单位：__________________编制时间：____年____月____日序言下载提示：该文档是本店铺精心编制而成的，希望大家下载后，能够帮助大家解决实际问题。
文档下载后可定制修改，请根据实际需要进行调整和使用，谢谢!并且，本店铺为大家提供各种类型的经典范文，如总结报告、心得体会、应急预案、演讲致辞、合同协议、规章制度、条据文书、教学资料、作文大全、其他范文等等，想了解不同范文格式和写法，敬请关注!Download tips: This document is carefully compiled by this editor. I hope that after you download it, it can help you solve practical problems. The document can be customized and modified after downloading, please adjust and use it according to actual needs, thank you!Moreover, our store provides various types of classic sample essays, such as summary reports, insights, emergency plans, speeches, contract agreements, rules and regulations, documents, teaching materials, complete essays, and other sample essays. If you would like to learn about different sample formats and writing methods, please pay attention!网页设计与制作报告（优秀3篇）在人们越来越注重自身素养的今天，越来越多的事务都会使用到报告，不同的报告内容同样也是不同的。
《网页设计与制作案例教程》教材习题答案第2章 网页制作基础1．填空题（1）静态 动态（2）HyperText Markup Lauguage 超文本标记语言（3）文本 图像 动画（4）Dreamwear Frontpage（5）窗口2．选择题（1）C （2）C （3）B （4）D （5）D 第3章 网站的创建与管理1．选择题（1）D （2）A （3）B （4）D （5）C第4章 页面的整体控制 1．选择题（1）B （2）A （3）A （4）C （5）D 第5章 文本操作 1．选择题（1）A （2）D （3）D （4）C （5）C 第7章 网页布局操作 1．选择题 w w w.k h d a w .c o m（1）C （2）A （3）A （4）A （5）B （6）B（7）B （8）B （9）B （10）C （11）C （12）B（13）A （14）A （15）C （16）B （17）A （18）A（19）B （20）D （21）B （22）D （23）D （24）C（25）D （26）C （27）B （28）C （29）D （30）B（31）B （32）C （33）B （34）D （35）A （36）A（37）D （38）C （39）D （40）A第9章 超级链接与导航栏1．选择题（1）A （2）B （3）C （4）A （5）D （6）B（7）D （8）C第10章 创建表单网页1．选择题（1）A （2）D （3）C （4）B （5）C （6）B（7）B （8）A第11章 HTML 语言 （1）<html> </html> <body> </body> （2）<img> <br> （3）bgcolor background （4）<table> <tr> <td> 2．选择题 （1）A （2）A （3）B （4）B （5）C （6）A （7）D （8）B （9）C （10）B （11）A （12）B （13）C （14）Cw ww .k h d a w .c o m第12章 使用CSS 样式美化网页1．选择题（1）D （2）C （3）B （4）B第13章 JavaScript 技术1．选择题（1）D （2）B （3）B （4）D （5）A第14章 网页特效1．选择题（1）A （2）B （3）B （4）D （5）C （6）B第15章 网站规划与网页设计1．选择题（1）C （2）C （3）C （4）A （5）C （6）C（7）A （8）A （9）D （10）C （11）D （12）D （13）A （14）D （15）A （16）B （17）B （18）C第16章 网站的测试、发布与维护 1．选择题 （1）D （2）D （3）D （4）B （5）B （6）C （7）D （8）D w w w .k h d a w .c o m。
第13章 CSS的属性和值一、CSS字体属性1、字体集合(font-family)可以用一个指定的字体名或一个种类的字体集合。
多个集合的赋值是可以使用的，而如果确定了一个指定的字体赋值，就应该有一个种类集合名随后，以防第1个选择不存在。
定义一个字体的集合的时候，就相当于定义了一个字体的控制集合，当浏览器解释执行的时候，会控制集合中所列的字体顺序从前到后的选择字体。
任何包含空格的字体名都必须用单引号引住。
字体集合也可以用字体属性给出。
案例名称：字体集合l2-1.htm<html><head><title>字体集合</title><style type="text/css">p{font-family:"隶书",times,serif}</style></head><body><p>字体集合</p><p>text/css</p></body></html>■CSS字体■2002:7:25 ·eva(原创)■ FONT-FAMILY属性：每部机器上都装有多种字体，浏览器会使用默认的字体浏览网页，比如简体中文版WINDOWS汉字默认是宋体，英文默认是ARIAL。
使用FONT-FAMILY属性则可以规定浏览器用什么字体解读网页。
■ FONT-FAMILY语法实例：h2 {font-family:times,impact,sans-serif}说明如下:helvetica是浏览器首先寻找的字体名称，如果有就使用它。
在helvetica字体没有找到的情况下，则会寻找impact字体，如果找到就使用它。
如果以上两种字体都没有找到，则指示浏览使用sans-serif（通用字体）。
在你不能保证你列出的字体浏览者一定会安装时，将一种通用字体加在字体列表中是一种好的做法。
因此我们提倡使用最基本的字体制作网页，比如中文用宋体，英文用ARIAL，这样使得你的网页不会因为浏览器没能使用合适的字体解读而变样。
如果一种字体的名称中有空格，如"Times New Roman"，在CSS语句中要用引号包含该字体。
例：Body {font-family:"Times New Roman",serif}如果该语句已在双引号里，则字体名降级为单引号。
例：<P style="font-family:'Times New Roman',serif">如果该语句包括其它CSS规则，字体说明应放在最后。
例:H2 {color:red;margin:10px;font-family:"Times New Roman",serif}2、字体风格(font-style)该属性以3个方法的其中一个来定义显示的字体：normal（普通）、italic（斜体）或oblique（倾斜）。
案例名称：字体风格l2-2.htm<html><head><title>字体风格</title><style type="text/css">p{font-style:oblique}</style></head><body><p>字体风格</p></body></html>3、字体变形(font-variant)字体变形属性决定了字体的显示是normal（普通）还是small-caps（小型大写字母）。
当设置字体变形为小型大写字母时文字中的所有小写字母会显示比大写字母稍小的大写字母。
案例名称：字体变形l2-3.htm<html><head><title>字体变形</title><style type="text/css">p{font-variant:small-caps}</style></head><body><p>字体变形ABCabc</p></body></html>4、字体加粗(font-weight)字体加粗属性用作说明字体的字重,该属性值可以从100到900，normal相当于400，bold相当于700，bolder是将继承值加上一个等级，lighter是将继承值减上一个等级。
浏览器能不能正确显示要看使用的字体类型支持几种粗细值。
案例名称：字体加粗l2-4.htm<html><head><title>字体加粗</title><style>p{font-family:Verdana;font-size:20pt}</style></head><body><table width="100%" border="1"><tr><td><p style="font-weight:100">font-weight:100</p></td><td><p style="font-weight:600">font-weight:600</p></td></tr><tr><td><p style="font-weight:200">font-weight:200</p></td><td><p style="font-weight:700">font-weight:700</p></td></tr><tr>59<td><p style="font-weight:300">font-weight:300</p></td><td><p style="font-weight:800">font-weight:800</p></td></tr><tr><td><p style="font-weight:400">font-weight:400</p></td><td><p style="font-weight:900">font-weight:900</p></td></tr><tr><td><p style="font-weight:500">font-weight:500</p></td><td> </td></tr></table></body></html>5、字体大小(font-size)字体大小属性用作修改字体显示的大小：xx-small/x-small/small/medium/large/x-large/xx-large /smaller/larger/百分比/高度。
关键字的本级与上级的比是：1:1.5，比如：medium 与large 的比是1:1.5；而larger 是将继承值加上一级，smaller 是将继承值减上一级；百分比是将默认字体扩大或缩小若干倍；高度的单位前面已讲过。
案例名称：字体大小 l2-5.htm<html><head><title>字体大小</title><style>span{font-size:20pt}</style></head><body><table width="100%" border="1"><tr align="center"><td><p style="font-size:xx-small">xx-small</p></td><td><p style="font-size:x-small">x-small</p></td><td><p style="font-size:small">small</p></td></tr><tr align="center"><td colspan=3><p style="font-size:medium">medium</p></td></tr><tr align="center"><td><p style="font-size:large">large</p></td><td><p style="font-size:x-large">x-large</p></td><td><p style="font-size:xx-large">xx-large</p></td></tr><tr align="center"><td><p style="font-size:50%">50%</p></td><td><p style="font-size:100%">100%</p></td><td><p style="font-size:200%">200%</p></td></tr><tr align="center"><td><p style="font-size:5pt">5pt</p></td><td><p style="font-size:10pt">10pt</p></td><td><p style="font-size:20pt">20pt</p></td></tr><tr align="center"><td><span>20pt</span></td><td><span><p style="font-size:smaller">20ptsmaller</p></span></td><td><span><p style="font-size:larger">20ptlarger</p></span></td></tr></table></body></html>6、字体(font)属性值：[<font-style> || <font-variant> || <font-weight> ]<font-size>[/<line-height>]<font-family>该属性可以一次定义前面所提到的所有属性，还有行高。
