网页设计与制作HTMLCSS教学大纲
《网页设计与制作》教学大纲
《网页设计与制作》教学大纲一、说明1、课程的性质与内容《网页设计与制作》课程就是计算机应用技术、电子商务等专业的一门核心课程,也就是其她计算机专业的普及型课程。
内容主要涵盖了HTML语言的语法规则及文字、链接、列表、表格、表单、图像、多媒体、框架元素标记及属性,、JavaScript脚本编程语言、Dreamweaver、Fireworks、Flash、Photoshop等相关知识,全面介绍WEB站点设计的基本操作技术与使用技巧。
2、课程的任务与要求通过本课程的学习,要求学生掌握静态网页的制作方法、学会HTML语言、熟悉站点的上传与维护并能够独立解决网页编辑中遇到的一般问题,能熟练运用Dreamweaver进行网站的导入、规划、管理、发布的相关技术及网页制作的操作技能;能熟练掌握JAVASCRIPT脚本编程语言的基本语法知识,能实现网页的交互与特殊效果;能维护、管理与设计WEB应用程序;能独立设计小型WEB站点。
3、教学中应注意的问题在教学过程中要注重Dreamweaver、Firework或Photoshop与Flash软件的主要功能,其中Dreamweaver主要就是完成网页设计与网站管理;Firework或Photoshop主要进行图像的设计与编辑;Flash主要开发适应网络传输的流媒体电脑规划。
并且要培养学生综合使用这些软件的能力,注重学生动手能力的培养与上机试验。
教学过程中应该以Dreamweaver为主。
在讲授理论的同时加入具体的设计项目实验,力求达到实战的效果避免空洞的理论学习。
二、学时分配三、课程内容及要求模块一、初识网站与网页教学要求:1、使学生对网站及网页有一定的认识,激发学生学习网页设计的兴趣2、了解网页中的常用元素类型3、了解常用网站管理与制作软件4、了解网站建设流程5、理解HTML与CSS基本知识教学内容:1-1 认识网站与网页1-2 网页中的元素类型1-3 常用网站管理与制作软件1-4 网站建设流程1-5 HTML与CSS入门模块二、初识Dreamweaver 教学要求:1、熟悉Dreamweaver操作环境2、了解网站规划与管理3、掌握页面属性的设置教学内容:1-1 熟悉Dreamweaver操作环境1-2 网站规划与管理1-3 设置页面属性模块三、网页布局方法教学要求:1、掌握使用表格来布局来定位网页2、掌握使用使用框架布局网页教学内容:1-1 使用表格布局网页1-2 使用框架布局网页模块四、编辑网页元素教学要求:1、掌握文本输入与编辑2、掌握在网页使用图像3、掌握使用Flash动画4、了解使用其她媒体元素教学内容:1-1 文本输入与编辑1-2 使用图像1-3 使用Flash动画1-4 使用其她媒体元素模块五、使用超链接教学要求:1、掌握超链接的设置2、掌握如何管理超链接教学内容:1-1 设置超链接1-2 管理超链接模块六、HTML样式与CSS样式教学要求:1、掌握编辑基本HTML代码标记2、掌握创建与使用CSS样式表教学内容:1-1 编辑HTML代码1-2 创建与使用CSS样式表模块七、Dreamweaver高级应用教学要求:1、熟悉行为的使用2、掌握时间轴的基本应用3、掌握表单及其应用4、了解模板与库5、熟练掌握CSS样式的应用教学内容:1-1 使用行为1-2 时间轴的应用1-3 表单及其应用1-4 模板与库1-5 CSS样式的应用模块八、网站的优化教学要求:1、掌握网站的基本优化技巧2、掌握页面的美化与工具的使用3、掌握站点的整体优化教学内容:1-1 页面的美化1-3 站点的优化模块九、站点的发布教学要求:1、掌握发站点发布前的工作与程序2、掌握发布站点与站点的后续维护与更新教学内容:1-1 发布前的工作1-2 发布站点与站点的后续维护与更新。
《网页设计与制作》课程教学大纲
《网页设计与制作》课程教学大纲一、课程的性质和任务课程性质：《网页设计与制作》是现代汽车技术/计算机及应用专业的一门选修课程，是学习网页设计与制作的一门重要课程。
主要任务：向学生全面介绍与网页设计制作有关的知识，向学生阐明Web 基本工作机制，并使学生具有解决一般网页制作问题的能力。
与此同时，通过对Web页制作技术和制作工具的学习，使学生对于网页设计中所涉及的相关知识有一个全面的了解。
掌握通过HTML语言、FrontPage、Flash工具软件设计制作一个网站的方法与技巧。
基本要求：1、了解Internet的过去、现在和将来及有关WWW、HTTP、HTML、CSS的定义，概念和作用；2、了解图像的几种格式：GIF、JPEG、PNG和矢量图格式，它们各自的特点和差别；3、理解服务器、客户端、浏览器的概念和作用；4、深入理解HTML语言中的各种文本格式、字符格式、段落设置、列表、标记、表格、框架、表单的作用；5、理解客户端脚本程序的工作方式；6、熟练掌握使用绝对和相对URL，创建超链接，图象链接，图象映射的建立方法；7、会使用FrontPage2000、DreamWeaver等网页制作工具制作网页；二、课时分配课程教学总学时数为42学时，具体分配见课时分配表。
课时分配表三、本课程的教学内容第一章 HTML概述什么是HTML；什么是WEB；HTML的定义；基本的HTML语法；标记符的属性； WEB页的基本结构；HTML标记；首部标记；正文标记符；添加注释；显示特殊字符。
第二章页面背景与颜色控制页面背景；背景颜色；背景图案；字符和链接的颜色。
第三章文本格式字符格式；物理字符样式；逻辑字符样式；段落格式；分段与换行；段落对齐。
第四章列表格式有序列表；OL标记符和LI标记符；有序列表的嵌套；无序列表；定义无序列表；混合嵌套列表；定义列表；创建定义列表；使用定义列表缩排文档第五章使用图象WEB页图象格式；在网页中插入图象；IMG标记符及其基本属性；图象布局；使用GIF动画；创建GIF动画；注意事项；使用网页图象的要点。
HTMLCSS网站设计基础教程教学大纲(二)
HTMLCSS网站设计基础教程教学大纲(二)
- 简介
- 介绍HTMLCSS网站设计基础教程的重要性
- 概述教学大纲的内容
- HTML基础
- 介绍HTML的概念和作用
- 讲解HTML标签和属性
- 演示HTML的基本结构和语法
- 实践练习：编写简单的HTML页面
- CSS基础
- 介绍CSS的概念和作用
- 讲解CSS的选择器和属性
- 演示CSS的基本语法和样式规则
- 实践练习：为HTML页面添加样式
- 网页布局
- 介绍网页布局的概念和重要性
- 讲解盒模型和浮动布局
- 演示网页布局的实现方法
- 实践练习：编写具有不同布局的网页
- 响应式设计
- 介绍响应式设计的概念和优势
- 讲解媒体查询和弹性布局
- 演示响应式设计的实现方法
- 实践练习：编写适应不同屏幕大小的网页
- 网页交互
- 介绍网页交互的概念和实现方式
- 讲解JavaScript的基本语法和DOM操作
- 演示网页交互的实现方法
- 实践练习：为网页添加交互效果
- 网站优化
- 介绍网站优化的概念和重要性
- 讲解SEO和网站性能优化
- 演示网站优化的实现方法
- 实践练习：优化网站的SEO和性能
- 结语
- 总结HTMLCSS网站设计基础教程的教学大纲 - 强调学习HTMLCSS网站设计基础的重要性 - 鼓励学习者继续深入学习和实践。
《网页设计与制作》教学大纲
《网页设计与制作》教学大纲一、课程基本信息：1．课程编号：2．课程名称：网页设计与制作3．英文名称：Design and Making of Webpages4．课程简介：《网页设计与制作》是新闻学专科的一门专业课程。
本课程综合讲述了网页设计与网站建设的基本原理、关键技术及其开发和应用，本课程注重实用性和操作性。
综合介绍Dreamweacer、Fireworks、Flash在设计网站及网页方面的应用。
主要内容包括：Dreamweacer简介；创建Web网站和Web页面，在页面中添回各种元素；网页超链接；表格、层、框架的灵活使用；css样式表，创建动态交互式网页: Fireworks概述；文本、图片的创建及特效；图像处理优化；动画制作；制作网页的交互性；flash基本界面和操作图形、文本处理编辑；动画制作；符号和图层的创建使用动画中添加声音；交互式动画制作等。
二、课程说明：1．教学目的和要求：通过本课程的学习，了解网页网站的基础知识；掌握网页三剑客的使用方法；学会综合使用多种工具，来创建和优化网站网页，为学生自学图形设计、多媒体制作及广告设计，今后进行网站的设计和开发打下良好的基础。
2．与相关课程衔接：大学计算机基础3．周课时、总学时：4课时；总学时：72课时，理论课36课时，实践实验课36课时。
4．开课学期：第四学期5．教学方法：讲授与实践相结合。
6．考试方法：平时占30%，期中考试占20%，期末考试占50%。
平时成绩中包括上机实训报告（30%）。
7．实验、实习、作业：5次实训，课堂讨论、作业8．教材：暂用《Dreamweacer+Photoshop+Flash+Fireworke8网站建设与网页设计详解（cs3版）》电子工业出版社孙东海编著9．教学参考资料：《Dreamweaver Photoshop Flash Fireworks JavaScript网页制作实例大讲堂》人民邮电出版社孙宇等编著2008年版《网页制作与网站建设从入门到精通》人民邮电出版社宇帆，王方，何翠平编著2008年版《Flash基础教程》曾顺编著清华大学出版社2008年版《中文Flash MX 教程》成昊编著北京科海电子出版社2008年版《中文photoshop教程》图灵编浦东电子出版社008年版《Flash基础教程》曾顺编著清华大学出版社008年版三、课程内容与教学要求第一章Fireworks 基本操作一、教学要求：掌握Fireworks 的基础操作方法（新建、打开、导入、导出Fireworks 文档），以及“首选参数”对话框的设置方法。
（完整版）《网页设计与制作》课程教学大纲.docx
（完整版）《网页设计与制作》课程教学大纲.docx《网页设计与制作》课程教学大纲课程名称：网页设计与制作学分及学时： 4 学分总学时72学时，理论36 学时适用专业：网络工程开课学期：第四学期开课部门：计算机与互联网学院先修课程：计算机文化基础计算机网络考核要求：考试使用教材及主要参考书：向知礼主编：《网页设计与制作》航空工业出版社2017 年杨松主编：《网页设计案例教程》航空工业出版社2015 年一·课程性质和任务：本课程全面地介绍网页制作技术的基本理论和实际应用。
全书共10 章，分为 3 大部分。
前 5 章为第 1 部分，主要介绍网页制作的基本理论——HTML，同时穿插介绍Fireworks，Flash，Anfy 等软件在网页制作过程中的应用；第 6 章～第 8 章为第 2 部分，主要介绍网页制作技术，包括CSS技术、客户端脚本技术(DHTML)以及XML 技术；第9 章～第 10 章为第3 部分，主要介绍当前最流行的网页制作工具——Dreamweaver ，通过应用实践能够从实际应用的角度进一步巩固所学知识。
课程内容不但包括各种网页制作技术的基础理论，而且强调网页制作的具体应用，使读者既能打下坚实的理论基础，又能掌握实际的操作技能。
二·课程教学目的与要求以Dreamweaver 的使用为主线，介绍网页制作的相关技术。
使学生理解网页制作的基本概念和理论 ,掌握站点的建立和网页的设计 ,能用 HTML 语言修改网页 ;掌握网页制作和站点的基本知识 ;掌握站点的创建和网页的编辑 ;掌握超链接、图像、 CSS样式的使用 ;掌握表格、框架、表单、多媒体对象的使用; 理解行为、模板、库、CSS布局的概念和使用 ;理解 HTML 语言、网站的测试与的发布；要求：教学过程中，须注重学生实践操作能力的培养，采取“面向实践、能力为先”的教学思路，教学内容应结合当前WEB 技术的发展趋势，把握未来企业级WEB 页面开发的发展方向，兼顾各行各业的需求变化，力争面向社会，服务于企业“互联网+”战略。
《网页设计与制作》课程教学大纲
《网页设计与制作》课程教学大纲课程编号：课程名称：网页设计与制作总学分：总学负荷：自主学习：课内总学时数：课内实验实践上机学时：先修课及后续课一、说明部分．课程性质：网页设计与制作课程是为全院非计算机专业文科学生开设的一门计算机基础课，是一门必修的公共基础课，也是计算机应用的初级课程。
．教学目标及意义：随着网络的高速发展，网页也越来越多地出现在人们的面前，成为和普通用户的交流界面，而网页制作则成为网络时代学习信息技术需要掌握的基本技能之一。
本课程全面地介绍了网页设计所涉及的基本概念和常用的设计工具，包含了静态网页设计、脚本语言编程、动态网页设计、网站规划、设计与管理等技术。
这些知识和技能对于信息时代的大学生来说是必不可少的。
通过本课程的学习，使学生系统掌握应用等工具进行网页设计与制作的思想和方法，培养学生合理规划、创建网站的能力，为今后进一步学习和掌握计算机知识和技术打下良好的基础。
．教学内容和要求:了解网站的有关名词；掌握网站设计的基本思路；了解常用的网页设计工具。
掌握中的各种标记及其属，并熟练使用。
熟悉和掌握使用建立与管理站点；掌握页面布局的方法；熟练运用创建个人主页。
掌握的语法规则、函数和三种基本结构；掌握使用编写页面的方法；熟练掌握程序的事件处理；掌握文档对象的使用。
了解运行机制及运行环境的搭建方式，掌握内建对象的应用；掌握利用实现页面与数据库的连接；掌握动态页面设计。
了解网站设计前期所需的准备工作；掌握根据网站主题的需要来进行页面设计；了解网站测试与上传。
. 教学重点、难点：网页设计工具的使用，网页设计的方法。
. 教学方法与手段：采用多媒体教学，通过课堂上理论精讲、案例分析讨论、实例演示与上机操作相结合，以及课下以学生自主学习为主、老师辅导为辅，完成教学工作，将课内课外学习结合，提高学生自主学习主动性，实现理论和实践教学一体化，达到网页设计应用能力培养的目标。
. 教材及主要参考书：教材：李京文等编著《网页设计与制作》安徽大学出版社参考书：[]李京文《网页设计与制作》高等教育出版社[]李京文《网页设计与制作实训与考试指导》高等教育出版社[]潭浩强《网页编程技术与实例》人民邮电出版社.其它：自主学习的设计与安排：学生自主学习标记语言的应用，综合运用设计网页，学会使用脚本丰富页面效果，了解运行机制及运行环境的搭建，学习简单动态页面设计。
网页设计与制作教学大纲
《网页设计与制作》课程教学大纲一、说明（一）课程定义：《网页设计与制作》课程是网络与新媒体专业的一门核心课程，也是其他计算机专业的普及型课程。
内容主要涵盖了HTML语言的语法规则及文字、链接、列表、表格、表单、图像、多媒体、框架元素标记及属性，、JavaScript脚本编程语言、Dreamweaver、Fireworks、Flash、Photoshop 等相关知识，全面介绍WEB站点设计的基本操作技术和使用技巧。
（二）编写依据：本课程根据武汉体育学院体育科技学院人文社科系网络与新媒体专业人才培养方案编写。
（三）目的任务：通过本课程的学习，要求学生掌握静态网页的制作方法、学会HTML语言、熟悉站点的上传和维护并能够独立解决网页编辑中遇到的一般问题，能熟练运用Dreamweaver进行网站的导入、规划、管理、发布的相关技术及网页制作的操作技能；能熟练掌握JAVASCRIPT脚本编程语言的基本语法知识，能实现网页的交互和特殊效果；能维护、管理和设计WEB应用程序；能独立设计小型WEB站点。
（四）学时数与学分数：本课程教学总学时为72课时,4学分，理论48学时，实践/实验24学时。
具体学时分配参照下表。
（五）适用对象：网络与新媒体专业。
（六）课程编码：二、教学内容与学时分配三、教学内容与知识点第一章初识网站和网页第一节网站和网页知识点：网站和网页的概念。
第二节网页中的元素类型知识点：行元素、块元素。
第三节常用网站管理制作软件知识点： Dreamweaver、flash。
第四节网站建设流程知识点：网站建设流程。
第五节 Html与CSS入门知识点：html概念、css概念。
第二章初识Dreamweaver第一节熟悉Dreamweaver操作环境知识点：Dreamweaver操作环境。
第二节网站规划与管理知识点：网站规划原则、管理方法。
第三章网页布局方法第一节使用表格布局网页知识点：表格布局方法。
第二节使用框架布局网页知识点：框架布局网页方法。
网页设计与制作教学大纲
《网页制作及设计》教学大纲学时：72 学时课程类别：专业必修课适用专业：软件技术一、课程的性质及任务课程的性质：本课程是一门专业基础课，要求学生掌握HTML、css和dreamweaver制作网页的知识和技术，同时为后续课程的学习奠定基础。
课程的任务：通过本课程的学习，使学生了解网站开发的流程，掌握HTML和CSS技术实现网页的构建和美化，并用dreamweaver CS5工具实现网页的制作。
前导课程：计算机应用基础后续课程：Javascript、 Java Web组件编程等二、教学基本要求本课程以《计算机应用基础》课程为基础，通过本课程的学习，应使学生掌握网页制作的基本方法，掌握HTML、CSS等网页基础编程知识，并使用主流工具Dreamweaver CS5进行网页制作。
三、教学条件多媒体教室，安装Adobe Dreamweaver CS5的一体化实训室四、教学内容及学时安排（一）优秀网页赏析教学时数：4教学目标：1.理解网站相关的概念。
2.了解网页的基本组成元素3.理解网站的主题定位，风格和网站布局。
4.制作第一个简单的静态网页教学重点难点：1. 理解网站的定位和风格2、学习模仿网页的色彩搭配2. 分析网站的布局3. 能模仿制作一个简单网页。
教学方法：案例演示、理论讲解教学案例：海尔集团网站（企业类）、携程旅游网（旅游类）、中国大众体育网（体育类）、新东方教育（教育类）、往届优秀毕业设计答辩系统、一个简单的静态网页理论教学内容：1. 不同行业网站赏析2. 网页及网站的概念和术语。
3. 网页组成元素。
4. 网站的策划及设计原则。
5. 网站的开发流程6. 应用HTML、CSS制作第一个简单静态网页实践教学内容：1.第一个静态网页实验目的：锻炼学生学会使用记事本编辑静态网页，使学生熟悉HTML标记语言和认识HTML语言的结构；提升学生学习兴趣和自信。
实验要求：要求学生会使用HTML搭建网页架构；在合适位置插入CSS代码并体会使用HTML制作网页的方法。
网页设计教学大纲(共3篇)
网页设计教学大纲〔共3篇〕第1篇：网页设计教学大纲网页设计教学大纲一、课程性质与任务1、课程性质《网页设计与制作》是中计算机专业开设的一门专业必修课，是计算机类专业的一门理论环节课程，也可以作为其他相关专业的理论课程或选修课，它是一门操作性和理论性很强的职业技术课程。
本课程的主要内容为系统介绍网页编辑与制作软件Dreamweaver cs3，通过这种有代表性的网页制作软件的使用，掌握网站设计的全过程，并能纯熟地制作出有专业水准的网站。
2、课程任务本门课程在专业教学方案中起着非常重要的作用，通过这门课程，学生可以掌握以下技能和知识：* 掌握网站的开发流程，如建站规划、效果图制作、建立站点等相关知识。
* 掌握各种网页元素在Dreamweaver cs3中的使用。
例如表格、文本、图像、超级链接、层和表单等。
* 熟悉一些网页设计辅助软件的功能和使用方法。
例如Flash、Fireworks、Photoshop等。
* 掌握测试和发布网站的方法。
包括网站测试的内容和方法。
* 可以解决一些网页设计中的常见问题。
* 理解ASP开发平台的搭建，Dreamweaver cs3在动态网页制作方面的应用。
二、课程教学目的与要求1、本课程的根本目的〔1〕使学生通过本课程的学习，掌握Dreamweaver cs3的使用方法，学会使用Dreamweaver cs3制作Web网页的技术。
〔2〕本课程学习完毕后，学生应能自行设计各种网页、开发一定规模的网站，使学生通过本课程的学习，纯熟掌握其根本制作方法和技巧，并最终设计一个综合性的网站并且编制简单的脚本上传到互联网上。
2、课程在知识、素质方面的根本要求〔1〕知识要求深化理解Inter，理解、、HTML等概念及作用；掌握网站设计和发布的1 流程。
理解网站维护管理的意义及重要性，理解效劳器、客户端、阅读器的概念和作用；理解多种网页制作软件和图像处理软件相结合设计网站的好处。
理解Dreamweaver cs3在动态网站上的应用。
《网页设计与制作》课程教案
《网页设计与制作》课程教案一、教学目标1. 了解网页设计与制作的基本概念和流程。
2. 掌握HTML、CSS和JavaScript的基本语法和应用。
3. 学会使用网页设计软件进行网页布局和美观设计。
4. 能够独立设计并制作一个简单的网页。
二、教学内容1. 网页设计与制作的基本概念和流程。
2. HTML的基本语法和使用方法。
3. CSS的基本语法和使用方法。
4. JavaScript的基本语法和使用方法。
5. 网页设计软件的使用方法和技巧。
三、教学方法1. 讲授法：讲解网页设计与制作的基本概念和流程，HTML、CSS和JavaScript 的基本语法和使用方法。
2. 示范法：通过实际操作演示如何使用网页设计软件进行网页布局和美观设计。
3. 练习法：学生跟随教师的步骤进行实际操作练习，巩固所学知识。
4. 互助法：学生之间相互讨论和帮助，解决学习中遇到的问题。
四、教学准备1. 教室环境：安装有网页设计软件的计算机。
2. 教学材料：教案、PPT、网页设计软件教程。
3. 网络环境：学生可以访问互联网，查找相关资料。
五、教学过程1. 导入：通过展示一些精美的网页，引起学生对网页设计与制作的兴趣。
2. 讲解：讲解网页设计与制作的基本概念和流程，HTML、CSS和JavaScript 的基本语法和使用方法。
3. 示范：教师使用网页设计软件进行网页布局和美观设计的实际操作演示。
4. 练习：学生跟随教师的步骤进行实际操作练习，巩固所学知识。
5. 讨论：学生之间相互讨论和帮助，解决学习中遇到的问题。
7. 作业：布置相关的练习题目，让学生课后巩固所学知识。
六、教学评估1. 课堂参与度：观察学生在课堂上的积极参与程度，提问和回答问题的积极性。
2. 练习完成情况：检查学生完成练习的情况，包括正确性和完整性。
3. 作业质量：评估学生作业的质量，包括对知识的掌握程度和创意性。
4. 同伴评价：学生之间相互评价对方的作品，提供反馈和建议。
网页设计与制作教学大纲
《网页设计与制作》课程教学大纲课程编号:课程名称：网页设计与制作课程类型:专业基础课总学时：64 讲课学时：32 实验学时：32适用班级:一、课程性质、目的和任务：（加粗，以下同）1、目的本课程要求学生掌握基本的HTML语言。
学会使用Dreamweaver开发工具进行网页设计。
这是一门重在实践的科目，因此需要学生多上机、多进行实际操作，把老师所教授的各种网页制作、版面设计以及程序熟练制作或调试出来，并且能够在此基础上有所创造、有更进一步的发挥。
2、任务本课程的主要任务是介绍利用Dreamweaver开发工具进行网页设计，包括新建、编辑和设置一个Web站点；如何对页面属性进行基本的设置，如何设置、编辑CSS层叠式样式表；如何排版文字、表格和层；如何进行基本的图像处理；建立框架；模板和库的使用和编辑；的发布与维护等基本知识与应用。
目的是通过本课程的学习，培养学生的实际动手能力和计算机的操作能力，能够运用所学的知识进行网页设计。
二、教学基本要求：（分三级：掌握、理解、了解）1．掌握：要求学生能够全面掌握所学容，并能够用其分析、应用与Dreamweaver网页设计相关的问题，能够举一反三。
2．理解：要求学生能够较好地理解与Dreamweaver网页设计相关的问题，并且能够进行简单分析和判断。
3．了解：要求学生能够一般地了解的所学容。
三、教学容及要求：第1章Dreamweaver基础教学容：Dreamweaver 的历史和简介Dreamweaver 的安装过程Dreamweaver 的全新界面改进的设计与开发环境主菜单介绍对象控制面板介绍教学要求：掌握：Dreamweaver的基本特点、新增功能及界面组成。
基本操作，如安装、新建、打开、导入、保存、关闭等。
理解：新增功能、界面组成的优点。
了解：Dreamweaver可以为我们做些什么。
第2章网页设计语言基础教学容：HTML及XHTML语言介绍常用的网页语法标记教学要求：理解：HTML及XHTML语言介绍，常用的网页语法标记第3章文本和图像处理教学容：文本属性面板编辑文本和插入对象设置文本的格式编号与项目符号在网页中插入图像图像的应用教学要求：掌握：设置文本属性和格式；编号与项目符号的使用；插入、编辑和排版图像。
《网页设计与制作(HTML CSS)》课程线上教学计划
4.2 盒子模型的边框属性 4.3 盒子模型的边距属性 4.4 盒子模型的背景属性
4.5 盒子的宽与高
4.6 元素的类型与转换 4.7 块元素垂直外边距的 合并 5.1 列表标记
2
8.1 CSS布局
1
第8章 网页布局
8.2 使用HTML+CSS布局 网页-准备工作
1
与具体项
目制作 8.3 使用HTML+CSS布局
1
网页—头部的制作
8.4 使用HTML+CSS布局 2 网页—主体的制作
8.5 使用HTML+CSS布局 1 网页—底部的制作
总课时：84
40
2 表格的创建、<table><tr><td><th>标记及其属性、 表格的结构 CSS控制表格边框、CSS控制单元格边距、CSS控制单
2 建立站点和站点初始化设置、整体效果图的分析、 图片的处理 头部效果图分析、准备图片素材、书写HTML搭建结
2 构、书写CSS样式控制网页元素（logo图片、搜索框、 导航、banner广告图） 主体效果图分析、准备图片素材、书写HTML搭建结
2 构、书写CSS样式控制网页元素（焦点图、产品推荐、 手机通讯、平板电脑、智能家电三大新闻模块） 分析底部效果图、准备图片素材、书写HTML搭建结
5.2 CSS控制列表样式
5.3 超链接标记
5.4 链接伪类控制超链接
线上 教学 课时
1 1 2
1
2 1 1 1 2 1
htmlcss课程设计
html css 课程设计一、教学目标本课程旨在通过学习HTML和CSS，使学生掌握网页设计与制作的基本技能，能够独立完成静态网页的构建。
知识目标要求学生理解并掌握HTML的基本标签、属性以及CSS的选择器、属性设置等；技能目标要求学生能够熟练运用HTML和CSS进行网页布局和美化；情感态度价值观目标培养学生的创新意识和团队协作精神，激发学生对网络技术的热爱。
二、教学内容本课程的教学内容主要包括HTML和CSS两部分。
HTML部分将教授学生基本标签的使用、属性的设置以及语义化标签的应用；CSS部分将教授学生选择器的使用、属性的设置、盒模型的理解以及响应式布局等。
具体的教学大纲和进度安排请参考下表：章节 | 内容安排 |———— | ———————————————- |第一章 | HTML基础 |1.1 | 网页与HTML |1.2 | 基本标签的使用 |1.3 | 属性设置与语义化标签 |第二章 | CSS基础 |2.1 | CSS选择器与基本样式设置 |2.2 | 盒模型与布局 |2.3 | 响应式布局与媒体查询 |第三章 | 网页美化与进阶技巧 |3.1 | 颜色、字体与边距设置 |3.2 | 过渡与动画效果 |3.3 | 网页组件设计与实现 |三、教学方法为了提高学生的学习兴趣和主动性，本课程将采用讲授法、案例分析法和实验法等多种教学方法。
讲授法用于向学生传授基本知识和概念；案例分析法通过分析实际案例，使学生更好地理解和掌握知识；实验法通过动手实践，培养学生的实际操作能力。
四、教学资源为了支持教学内容和教学方法的实施，丰富学生的学习体验，我们将选择和准备以下教学资源：教材《HTML与CSS入门教程》、参考书《HTML与CSS权威指南》、多媒体教学课件、在线编程练习平台以及实验室设备。
通过这些教学资源，学生可以更好地掌握HTML和CSS的知识与技能。
五、教学评估本课程的教学评估将采用多元化评价方式，全面客观地评价学生的学习成果。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
《网页设计与制作()》课程教学大纲
（课程英文名称）
课程编号：2
学分：5学分
学时：64学时（其中：讲课学时：45 上机学时： 19 ）
先修课程：计算机基础、计算机网络、计算机应用
后续课程：设计网页特效
适用专业：信息及其计算机相关专业
开课部门：计算机系
一、课程的性质与目标
《网页设计与制作()》是面向计算机相关专业的一门专业基础课，涉及计算机基础、互联网等内容，通过本课程的学习，学生能够了解网页发展历史及其未来方向，熟悉网页设计流程、掌握网络中常见的网页布局效果、学会制作各种企业，门户，电商类网站。
二、课程的主要内容及基本要求
第一章与网页设计概述（4学时）
[知识点]
➢的基础知识
➢简介
➢简介
➢常用浏览器介绍
➢工具使用
➢利用创建第一个页面
[重点]
➢简介
➢工具使用
[难点]
➢工具创建第一个页面
[基本要求]
➢了解版本的发展历程
➢掌握工具的使用，能够使用创建一个包含结构和样式的简单网页。
第二章入门（6学时）
[知识点]
➢基本语法结构
➢标记属性
➢常用文本控制标记
➢文本格式化标记
➢图像标记
➢相对路径和绝对路径
➢图文混排技巧
[重点]
➢基本语法结构
➢常用文本控制标记
➢图像标记
➢相对路径和绝对路径
[难点]
➢标记属性的使用
➢相对路径和绝对路径
[基本要求]
➢掌握基本语法结构
➢掌握中常用的文本标记
➢区分什么是相对路径和绝对路径
➢掌握图像标记的使用
➢掌握图片混排常用技巧
[阶段案例]
使用文本控制标记、图像标记及相关标记的属性实现网页中常见的图文混排效果，如下图所示。
第三章入门（8学时）
[知识点]
➢入门知识
➢样式规则
➢样式表书写位置
➢基础选择器
➢字体样式属性
➢样式外观属性
➢复合选择器
➢层叠性和优先级
[重点]
➢样式规则
➢基础和复合选择器
➢层叠性和优先级
[难点]
➢复合选择器
➢优先级
[基本要求]
➢理解语法结构
➢了解在网页中的重要性
➢熟悉书写的位置
➢掌握基础和复合选择器
➢掌握层叠性和优先级
[阶段案例]
通过文本样式属性控制网页中的文本，制作网页中常见的新闻页面，效果如下图所示。
第四章盒子模型（6学时）
[知识点]
➢盒子模型理论知识
➢盒子模型属性
➢元素类型的分类
➢元素类型的相互转换
➢盒子外边距合并问题
[重点]
➢盒子模型属性
➢元素类型分类
➢元素类型相互转换
[难点]
➢盒子模型复合属性
➢盒子模型总的宽度和高度
➢元素类型及其转换
[基本要求]
➢理解盒子模型
➢掌握盒子模型属性
➢掌握盒子模型中复合属性的写法
➢掌握元素类型及其转换方法
[阶段案例]
综合运用盒子模型的相关属性，制作网页中常见的盒子效果，如下图所示。
第五章列表与超链接（4学时）
[知识点]
➢有序列表
➢无序列表
➢自定义列表
➢控制列表样式
➢超链接
➢锚点链接
➢控制链接样式
[重点]
➢无序列表
➢自定义列表
➢控制列表样式
[难点]
➢控制列表样式
[基本要求]
➢掌握列表的三种分类
➢熟悉列表的嵌套
➢熟练掌握控制列表样式
➢掌握链接标记的使用
➢掌握结构与样式相分离的写法
[阶段案例]
使用列表与超链接标记组织页面，并通过控制列表与超链接的样式实现网页中常见的新闻列表效果，如下图所示。
新闻列表效果展示鼠标以上链接文本效果
第六章表格与表单（4学时）
[知识点]
➢表格标记
➢表格结构
➢控制表格
➢表单标签
➢表单控件
➢控制表单
[重点]
➢表格标签
➢控制表格和表单
➢表单标签
[难点]
➢表单标签
➢控制表单
[基本要求]
➢掌握表格标记的使用
➢了解表格结构
➢掌握表单标记的使用
➢掌握控制表单标记
[阶段案例]
使用表格与表单组织页面，并通过控制表格与表单的显示样式，制作网页中常见的注册界面，效果如下图所示。
第七章浮动与定位（8学时）
[知识点]
➢元素的浮动
➢清除浮动
➢属性
➢元素的定位
➢属性
[重点]
➢元素浮动
➢元素定位
[难点]
➢清除浮动
➢元素定位的分类
[基本要求]
➢掌握元素浮动
➢熟悉清除浮动的方法
➢掌握元素定位及其分类
➢熟悉设置层的叠放次序
[阶段案例]
综合运用元素的浮动与定位，制作传智播客设计学院首页，效果如下图所示。
第八章高级技巧（6学时）
[知识点]
➢精灵技术
➢滑动门技术
➢负值的应用
[重点]
➢精灵技术
➢滑动门技术
➢负值的应用
[难点]
➢精灵原理分析
➢滑动门原理分析与切图
➢运用负值综合运用
[基本要求]
➢掌握精灵图的制作
➢掌握利用对精灵图片进行背景设置
➢掌握常见滑动门布局
➢掌握利用负值进行布局技巧
[案例实战1]
使用精灵，制作精品课程模块，效果如下图所示。
[案例实战2]
使用滑动门，制作梯形网站导航，效果如下图所示。
[案例实战3]
应用的负值，制作压线效果，如下图所示。
第九章布局与浏览器兼容性（6学时）
[知识点]
➢常见网页布局
➢通栏布局
➢分类
➢条件注释
➢常见6
➢盒子外边距合并
[重点]
➢通栏布局
➢
➢常见6
[难点]
➢
[基本要求]
➢熟悉网页常见的布局
➢掌握网页通栏布局技巧
➢掌握
➢熟悉 6 下常见的
第十章实战开发(上)—传智播客设计学院首页面（6学时）
[知识点]
➢建立站点
➢页面分析
➢首页切图
➢制作头部
➢制作
➢制作主体
➢制作底部版权
[重点]
➢制作页面首页
[难点]
➢制作页面首页
[基本要求]
➢了解一个网站制作流程
➢熟悉根据效果图分析页面布局
➢掌握切图技巧
➢掌握首页布局
[实战开发]
综合运用与的基础知识，制作传智播客设计学院首页，效果如下图所示。
第十一章实战开发(下)—传智播客设计学院子页面（6学时）
[知识点]
➢利用制作模板文件
➢使用模板文件
➢引用模板文件
➢利用模板文件制作列表文件
[重点]
➢利用制作模板文件
➢利用模板文件生成列表页面
[难点]
➢利用制作模板文件
[基本要求]
➢掌握利用制作模板文件
➢熟悉模板文件引用
➢掌握利用模板文件生成其他页面
[实战开发]
综合运用与的基础知识，制作关于我们页面、课程介绍页面、课程介绍详情页面，效果图分别如下。
关于我们页面效果图
课程介绍页面效果图
课程介绍详情页面效果图
三、学时分配
四、考核模式与成绩评定办法
本课程为考试课程，期末考试采用百分制的闭卷考试模式。
学生的考试成绩由平时成绩（30%）和期末考试（70%）组成，其中，平时成绩包括出勤（5%）、作业（5%）、实验和上机成绩（20%）。
五、选用教材和主要参考书
本大纲是根据教材《网页设计与制作()》所设计的。
六、大纲说明
本课程的授课模式为：课堂授课+上机，其中，课堂主要采用多媒体的方式进行授课，并且会通过测试题阶段测试学生的掌握程度；上机主要是编写程序，要求学生动手完成指定的程序设计或验证。
撰写人：审定人：
批准人：执行时间：。