下载文档原格式
《网页设计与制作》课程标准序言：《网页设计与制作》是理实一体化课程，是计算机专业（软件与信息服务、数字媒体、计算机应用专业）的一门重要的专业必修课。
本课程定位于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。
网页设计与制作报告网页设计与制作报告精选8篇在人们越来越注重自身素养的今天，报告与我们的生活紧密相连，我们在写报告的时候要注意逻辑的合理性。
那么报告应该怎么写才合适呢？下面是小编帮大家整理的网页设计与制作报告，欢迎阅读，希望大家能够喜欢。
网页设计与制作报告1毕业后，我来到了社会这个汇集众多江河湖水的大海，感受到了独立生活的好处与艰辛，同时我自己也更深的理解了，家长和学校老师对我们的殷切希望，在社会实习的这段日子，我吃了些苦，受了些罪，可是整个人在肉体上和精神上却升华了很多，也比以前的变得更有自信了。
现将我的实习情况汇报如下：一、实习工作介绍我所在的这家公司，是一家做网上招商的商业网站，公司接收各种厂家提供的信息，然后由网络的技术人员，将商家的信息做成网页广告，然后挂在我们的网站上，以此达到商业推广的目的，类似我们公司的网站在同行业还有u88、28招商网等。
我和其它几位同事做为网络部的技术人员，主要的工作就是接收美工人员的网站模板，将其通过photoshop切片，然后导入dreamweaver进行排版，（排版主要使用css+div），并进一步的加以制作，完善美化，如加入js代码，或透明flash，因为网页是用css+div进行排版的，所以在最后一步的时候，我们还需要进行浏览器测试，因为css+div排版方式有一个最大的缺点就是：浏览器不兼容的问题，典型的如：ie与fireworks，因为各种浏览器使用的协议不同，所以会导致页面在最终浏览的时候有一些小问题，如：页面混乱，图片、文字之间的距离过大或过小，页面不美观等等，做为一个新人，我在有些方面的技术还很不成熟，所以在技术总监张伟的帮助下，解决了很多问题，所在我很感谢他，当每天我们做完网页后，都会在代码页面加入注释代码，在里面写上每个人姓名的汉语拼间和工作日期，这样方便月底做统计工作，公司领导会根据每个人的工作数量进行奖励，每做一个页面会有2块的提成，虽然少点，但是积少成多，也是很可观的。
网页设计与制作报告(6篇)网页设计与制作报告(6篇)网页设计与制作报告1一、实习目的：通过社会实践，可以把我们在学校所学的理论知识，运用到客观实际中去，使自己所有用武之地。
以便能够达到拓展自身的知识面，扩大与社会的接触面。
1、了解平面设计在焦作的市场现状及前景。
2、进一步掌握ps，coreldraw，等设计软件的运用。
3、尝试把学校里学习的平面设计相关理论运用到实习过程中。
4、初探做好平面设计师的方法，熟悉平面设计的方法和程序步骤。
5、培养人际交往与社交能力，为成为平面设计师作准备。
二、实习时间：2023年1月1日―4月30日三、实习地点：威美（上海）金融伟德服务有限公司四、实习内容：平面设计五、实习总结：即将面临大学毕业，因为伟德视觉传达专业，想丰富一下自己的知识，所以我找到了一家互联网金融公司做UI平面设计，虽然和我所学的专业有些差异，但它对于我来说是受益匪浅，我所在的公司威美（上海）金融伟德服务有限公司，主要是网页设计为主，也与绘画有所伟德，既然选择这个公司，我就要好好去学，使自己的基础更牢固，技术更全面，在大学里学的知识却不知道如何运用，想伟德多个伟德，因此我非常珍惜这次实习的机会，在有限的时间里加深对绘画对设计的了解，找出自身的不足。
实习的内容是页设计（Ps，ai，arp等软件的使用）。
在实习过程中，我深深地感受到作为设计师通常缺乏足够的对市场的了解和对管理层领导上的沟通，做出的设计作品经常会与市场经济脱节；而作为管理者通常缺乏设计基础和审美能力，往往为了追求市场效益，过多地拘束设计师的思维与创新，忽略了设计要素的重要性，造成了设计的庸俗化。
来到公司，第一天进公司，与经理进行了简单面谈后，部门总监把我分配给伟德经理，伟德经理是我的直接领导，所有工作由伟德经理分布。
第一天来到公司要赶做两个网页banner，接到文案后就在网络上搜集大量banner素材，找了几个适合这次文案的banner然后用Photoshop简单的修改图片，第一天没有做好，幸好领导说第二天晚上再交给他，于是我就乖乖的回家找图片。
《网页设计与制作》实训十三多媒体与行为的应用预备操作：请将D:\MyWeb文件夹设置为根站点。
内容一：制作多媒体播放网页1、新建HTML空白文档，并切换到“设计”视图；2、选择“插入”菜单“表格”命令，插入一个表格，参数如下：3、选中表格，在“属性”面板设置表格“对齐”为“居中对齐”：4、选中第一行两个单元格，在“单元格”属性面板单击“合并”按钮；并选中所有单元格，设置单元格“水平”为“居中对齐”；5、分别将光标放置在第2行第1列和第4行第1列，在属性面板设置单元格宽度为“448”，高度为“300”，并输入相应文字，效果如下图：6、将光标置于第2行第1列，选择“插入”菜单中“媒体”下的“插件”，打开对话框，选择“Media”文件夹中的“Aigrete.avi”文件：7、选中刚才插入的对象图标，在属性面板设置宽度为“320”，高度为“240”，如下：8、用同样的方法在第2行第2列中插入“bwbl.mp4”，并设置宽度440，高度300；9、在第4行第1列中执行“插入”“媒体”下“SWF”，选择“Media”文件夹中的“tuxiang.swf”文件，并设置宽度440，高度300；10、在第4行第2列执行“插入”“媒体”下“插件”，选择“Media”文件夹中的“zxmzf.mp3”文件，并设置宽度400，高度100；效果如下：11、选中第5行第1列中“播放SWF动画”文字，在属性面板设置“链接”为“Media/bugudan.swf”；12、保存文档，按F12键在浏览器中预览效果如下：内容二：制作应用行为页面：第一部分：创建页面1、新建HTML空白文档，并切换到“设计”视图；2、单击“插入”面板“布局”选项中的“绘制AP Div”按钮，在文档中拖动鼠标绘制层对象“apDiv1”，并在属性面板中设置其属性：3、单击“插入”面板“布局”选项中的“绘制AP Div”按钮，在文档中拖动鼠标绘制层对象“apDiv2”，并在属性面板中设置其属性：5、单击“插入”面板“布局”选项中的“绘制AP Div”按钮，在文档中拖动鼠标绘制层对象“apDiv4”，并在属性面板中设置其属性：7、单击“插入”面板“布局”选项中的“绘制AP Div”按钮，在文档中拖动鼠标绘制层对象“apDiv6”，并在属性面板中设置其属性：9、将光标放入“apDiv6”中，在“apDiv6”中插入一个2行2列的表格，表格宽度为200，边框为1，填充和间距都为0，效果如下：10、选中所有单元格，在属性面板设置单元格高度和宽度都为100，背景颜色为绿色：11、将光标置于“apDiv1”中，选择“插入”菜单中的“图像”命令，将“Images”文件夹中的“T00.jpg”图像插入其中，并选中图片，在属性面板中设置图片宽度和高度都为100；效果如下：12、用同样方法将图片“T21.jpg”插入“apDiv2”中，将图片“T11.jpg”插入“apDiv3”中，将图片“T22.jpg”插入“apDiv4”中，将图片“T12.jpg”插入“apDiv5”中，全部设置高度和宽度为100；将图片“A10.jpg”插入“apDiv7”中，设置高度和宽度为70，效果如下：13、选中“apDiv1”，在属性面板中设置其可见性为“hidden”：第二部分：设置行为：14、在“窗口”菜单中选择“行为”，打开“行为”面板：15、在状态栏标签选择器中选择“body”，在“行为”面板中单击“+”按钮，选择“弹出信息”命令，打开“弹出信息”对话框。
第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>该属性可以一次定义前面所提到的所有属性，还有行高。
