本课程是计算机软件及相关专业在Web开发技术方面的基础课,它是为培养应用型人才掌握使用计算机的技能而开设的。本课程是一门有关网页设计以及网页制作的基础课程。本课程的任务是使学生具有使用HTML、CSS语言,主流开发工具(编辑器:Hbuilder、调试工具:Chrome Developer Toolbar)制作静态网页的能力,并为之后深入学习Web开发打下基础。通过本课程的学习,要求学生熟练掌握HTML语言的的基本语法,掌握CSS层叠样式表的使用方法;培养学生UI常识、网页设计规范、网页视觉方面的基本素养;要求具备利用HTML、CSS、及相关工具开发静态网页的技能。同时,兼顾实用软件的使用和计算机应用领域前沿知识的介绍,为学生进一步学习计算机有关知识打下坚实基础。
周次 | 教学内容 | 课程资料 | 教学形式(讲授+实践) |
---|---|---|---|
1 | 第一章 Web基础知识 | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
2 | 第二章 HTML语言基础 | Slides / [ Demos](/Topics/04. Stylus/demos) / Tasks / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
3 | 第三章 构建页面(一) | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
4 | 第四章 构建页面(二) | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / Videos | 3+0 |
5 | 第五章 构建页面(三) | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
6 | 第六章 HTML4.01与HTML5 | Slides / [ Demos](/Topics/04. Stylus/demos) / Tasks / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
7 | 第七章 CSS语言基础 第八章 文本样式和字体样式 |
Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
8 | 第九章 超链接和伪类 | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
9 | 第十章 背景样式和列表样式 | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
10 | 第十一章 网页布局 | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
11 | 第十二章 CSS盒子模型 | Slides / [ Demos](/Topics/04. Stylus/demos) / Tasks / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
12 | 第十三章 CSS高级内容 | Slides / [ Demos](/Topics/04. Stylus/demos) / Tasks / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
13 | 第十四章 div+CSS布局实战 | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
14 | 第十五章 浏览器兼容性调整 | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
15 | 第十六章 网页视觉设计 | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
16 | 第十七章 网页元素设计 | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
17 | 第十八章 网页设计规范 | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
18 | 实战:搭建完整网站 | Slides / [ Demos](/Topics/04. Stylus/demos) / [Tasks](/Topics/04. Stylus/homework) / [ Videos](/Topics/04. Stylus/VIDEOS.md) | 3+0 |
-
前端开发者手册
非常丰富的前端资料。 -
CSS diner
学习 CSS 选择器语法的闯关游戏教程。 -
CSS 布局
学习网页布局的闯关游戏教程。 -
UI设计相关内容大纲
相关UI设计PPT及课件可从web1备课讨论组下载