网页设计与制作

第1章网页设计基础

1.1Web时代的重要理念

1.1.1Web标准简介

1.1.2表现与结构相分离

1.1.3HTML 5时代

1.2网站的入门知识

1.2.1网页、网站及其构成元素

1.2.2网页设计的原则、风格和潮流

1.2.3网站建设的基本流程

1.2.4开发与调试工具

1.3习题

第2章HTML语言基础

2.1HTML的历史沿革

2.1.1HTML 4.01到XHTML

2.1.2从XHTML到HTML 5

2.1.3HTML 5要解决的问题

2.2文档结构

2.2.1标签、元素、属性和值

2.2.2DOCTYPE声明

2.2.3html元素、head元素与body元素

2.3HTML 5中常见的元素

2.3.1块级元素

2.3.2内联元素

2.3.3列表类元素

2.3.4表格类元素

2.3.5表单类元素

2.3.6多媒体类元素

2.3.7HTML 5新增的结构类元素

2.4过程指导——HTML 5元素的简单运用

2.5自主任务——使用记事本创建简单页面

2.6习题

第3章Dreamweaver CS6基础与CSS入门

3.1工作环境

3.1.1文档和编码工具栏

3.1.2属性面板

3.1.3常用面板介绍

3.1.4常规设置

3.2站点

3.2.1站点的基本概念及其创建方法

3.2.2“文件”面板的常用操作

3.2.3管理站点

3.3重要的div元素

3.3.1div元素是什么

3.3.2在Drearnweavet中创建DIV容器的方法

3.4CSS入门

3.4.1什么是CSS

3.4.2CSS语法与链接方法

3.4.3盒子模型

3.5常见的CSS选择器

3.5.1通配符选择器与类型选择器

3.5.2ID选择器与类选择器

3.5.3包含选择器与群组选择器

3.5.4属性选择器

3.6过程指导——淘 宝店铺周年庆专题页面

3.6.1过程分析

3.6.2步骤详解

3.7自主任务——“中秋茶相伴”淘 宝店铺专题销售页面

3.8习题

第4章文本与图像

4.1文本

4.1.1插入文本

4.1.2创建超链接

4.1.3与文本相关的基础属性

4.1.4行高与首行缩进

4.1.5文本阴影

4.1.6溢出文本与文本换行

4.1.7CSS伪类在超链接方面的应用

4.2图像

4.2.1插入图像

4.2.2与图像相关的CSS属性

4.2.3图文混排

4.3过程指导——使用HTML 5新增元素创建“灯塔漫画背景博客”

4.3.1过程分析

4.3.2步骤详解

4.4自主任务——图像与文本的简单应用

4.5习题

第5章浮动、定位和列表

5.1浮动

5.1.1浮动的基本知识

5.1.2清除浮动

5.2定位

5.2.1静态定位与固定定位

5.2.2相对定位与绝对定位

5.3列表

5.3.1与列表相关的CSS属性

5.3.2列表的图像修饰符

5.3.3纵向导航

5.3.4横向导航

5.3.5图文信息列表

5.4过程指导——“五月美食节专场”网页的设计与制作

5.4.1过程分析

5.4.2步骤详解

5.5自主任务——“手机专卖网”的制作

5.6习题

第6章表格与表单

6.1表格的创建与编辑

6.1.1创建表格

6.1.2单元格属性设置

6.1.3单元格基本操作

6.2CSS在表格中的应用

6.2.1使用border—collapse属性制作细线表格

6.2.2使用伪类选择器制作隔行变色表格

6.3表单的创建与编辑

6.3.1表单域

6.3.2常见表单对象

6.4CSS在表单中的应用

6.4.1文本域的美化

6.4.2CSS 3按钮

6.4.3搜索框的美化

6.5过程指导——“Yuze APP注册”页面的制作

6.5.1过程分析

6.5.2步骤详解

6.6自主任务——“网站后台登录”页面的制作

6.7习题

第7章框架、模板与CSS 3新增布局

7.1框架

7.1.1基本概念

7.1.2使用iframe元素创建框架页面

7.2模板

7.2.1模板是什么

7.2.2使用模板快速创建页面

7.2.3模板的修改

7.3CSS 3多列布局

7.3.1使用columns属性创建多列布局

7.3.2多列布局的相关属性

7.4CSS 3弹性盒布局

7.4.1使用盒布局

7.4.2弹性盒布局相关属性详解

7.5适合移动设备的响应式布局

7.5.1响应式布局

7.5.2使用CSS 3的Media Queries实现响应式布局

7.6过程指导——制作适合多种设备终端显示的响应式页面

7.6.1过程分析

7.6.2步骤详解

7.7自主任务——制作简单响应式页面

7.8习题

第8章行为与Spry构件

8.1行为

8.1.1事件与动作相关概念

8.1.2行为面板

8.1.3“弹出信息”行为

8.1.4“打开浏览器窗口”行为

8.1.5“改变属性”行为

8.2Spry构件

8.2.1Spry菜单栏

8.2.2Spry选项卡式面板

8.2.3Spry折叠式构件

8.3过程指导——“精品课程”网站的设计与制作

8.3.1过程分析

8.3.2步骤详解

8.4自主任务——“精品课程”网站主页的制作

8.5习题

第9章CSS进阶提高

9.1CSS Sprite技术

9.1.1CSS Sprite技术简述

9.1.2CSS Sprite技术详解

9.2CSS 3伪类选择器

9.2.1：root、：not、：target和：：selection选择器

9.2.2：first—child、：last—child和：only—child选择器

9.3CSS 3渐变

9.4CSS 3过渡

9.4.1transition属性

9.4.2CSS 3过渡动画的实现

9.5习题

第10章站点测试、上传与维护

10.1站点测试

10.1.1浏览器兼容性测试

10.1.2链接的测试

10.2站点上传

10.2.1注册域名

10.2.2申请网站空间

10.2.3站点上传

10.3维护与推广

10.3.1站点维护

10.3.2网站推广

10.4习题

第11章综合案例解析——电子商务网站

11.1电子商务网站的简易需求分析

11.2电子商务网站的布局分析

11.3实现过程

11.3.1主页的实现

11.3.2检索页的实现

11.3.3产品信息页的实现

11.4习题

第12章实训指导

12.1实训的意义和目的

12.2实训要求与步骤

12.3考核标准

参考文献

本书并非大而全地介绍HTML 5和CSS 3的相关知识，而是将其融合在Dreamweaver CS6软件的讲解之中，深入浅出地介绍Web前端开发需要掌握的必备知识和技能。全书共分为12章，章节安排难度递进，必备知识无缝衔接，每章有理论，堂堂有案例，课后有实训。为了推动教学模式的改革，编者特别制作了全程的微课视频，方便教师采用“翻转课堂”等教学形式进行教育探索。 在理论知识方面，一方面讲解Dreamweaver CS6软件的使用方法，另一方面注重从DIV+CSS思维模式到HTML 5+CSS 3思维模式的知识迁移和知识对比，可以使教师授课方便连贯，学生学习理解透彻。 在实践操作方面，注重提高读者的手写代码能力，每章除了小型案例以外，还提供模仿案例和自主提高案例，使读者可不断强化所学知识。 在配套资源方面，本书提供全套源文件、微课视频、PPT课件、课时授课计划和学期授课计划，为教师高效备课创造有利条件。 本书既可作为应用型本科、高职高专以及各层次院校计算机相关专业的教材，也可供希望从事网页设计的读者自学使用，还可作为IT类培训机构的网页设计培训教程。

本书将HTML 5与CSS 3技术融合在Dreamweaver CS6软件的讲解之中，深入浅出地介绍Web前端开发需要掌握的必备知识和技能。全书共分为11章，每章有理论，堂堂有案例，课后有实训。在理论知识讲解方面，注重DIV+CSS思维模式到“HTML5+CSS3”思维模式的知识迁移，教师授课方便连贯，学生学习理解透彻；在实践操作方面，注重提高读者的手写代码能力，每章除了小型案例以外，还提供模仿案例和自主提高案例，读者可不断强化所学知识。