HTML5+CSS3网页设计案例教程

前言
第1章 网页设计基础知识
1.1 网页相关知识简介
1.1.1 互联网、因特网、万维网
1.1.2 网站、网页和主页
1.1.3 浏览器
1.1.4 统一资源定位器
1.2 网页的基本元素
1.2.1 网页的组成元素
1.2.2 网页的构成要素
1.3 网站建设流程
1.3.1 网站需求分析
1.3.2 网站规划
1.3.3 创建本地站点
1.3.4 组织站点结构
1.3.5 设计和制作各级页面
1.3.6 申请空间和域名
1.3.7 测试和发布网站
1.3.8 网站的推广与维护
1.4 网页的版式布局
1.4.1 网页布局原则
1.4.2 常见的版式布局形式
1.5 网页色彩搭配
1.6 网页设计的原则和成功要素
1.7 认识HTML和CSS
习题
第2章 HTML基础
2.1 认识HTML
2.2 HTML文档的基本结构
2.3 HTML文件的编写和查看
2.3.1 HTML文件的编写和查看
2.3.2 HTML文件的命名
2.4 HTML基本语法
2.4.1 HTML标记
2.4.2 HTML属性
2.4.3 全局属性
2.5 HTML文件头部内容
2.5.1 设置页面标题
2.5.2 定义元数据
2.5.3 常用元数据
2.6 HTML文件主体内容
2.7 综合案例——最基本的HTML5网页
习题
第3章 文字与段落
3.1 编辑内容
3.1.1 添加普通文字
3.1.2 添加特殊符号
3.1.3 添加注释
3.2 文字排版
3.2.1 控制换行
3.2.2 预先格式化
3.2.3 段落
3.2.4 加入水平线
3.2.5 标题文字-
3.3 强调文本
3.3.1 设置粗体和斜体/
3.3.2 标记文本改变/
3.3.3 小型文本
3.4 语义化、结构化的文本
3.4.1 文字上下标/
3.4.2 注音显示//
3.4.3 标注
3.4.4 定义日期时间
3.4.5 其他语义化、结构化文本
3.5 列表
3.5.1 无序列表
3.5.2 有序列表
3.5.3 定义列表//
3.5.4 嵌套列表
3.6 综合实例——简单文字网页
习题
第4章 网页图像和多媒体元素
4.1 图像、视频和音频的格式
4.1.1 网页图像的格式
4.1.2 视频格式
4.1.3 音频格式
4.2 在网页中加入图像
4.2.1 图像资源属性——src属性
4.2.2 图像替代文本——alt属性
4.2.3 图像的宽高——width和height属性
4.3 在网页中加入视频
4.3.1 视频资源属性——src属性
4.3.2 视频播放控件属性——controls属性
4.3.3 视频准备播放控件——preload
4.3.4 的其他属性
4.3.5 与的配合使用
4.4 在网页中加入音频
4.5 插入多媒体文件
4.5.1 插入Flash动画
4.5.2 插入视频
4.5.3 插入音频
4.6 链入对象
4.7 定义媒介分组和标题/
4.8 综合实例——多媒体页面的设计
习题
第5章 超链接
5.1 超链接概述
5.2 超链接的路径
5.2.1 绝对路径
5.2.2 相对路径
5.2.3 根路径
5.3 超链接的建立
5.3.1 插入外部链接
5.3.2 插入内部链接
5.3.3 以图像为源点的链接
5.3.4 链接打开目标target属性
5.3.5 链接的其他属性
5.3.6 链接的目标类型
5.3.7 Email链接
5.4 锚记(书签)链接
5.5 设置图像映射
5.5.1 了解热区和图像映射
5.5.2 创建图像映射/
5.6 浮动窗口及其链接
5.6.1 浮动窗口
5.6.2 链接浮动窗口
5.7 定义基准网址
5.8 综合实例——设置超链接
习题
第6章 表格的应用
6.1 表格概述
6.2 创建表格
6.2.1 表格基本结构///
6.2.2 表格边框显示——border属性
6.2.3 标记的使用
6.2.4 表格标题
6.3 合并单元格
6.3.1 设置跨列——colspan
6.3.2 设置跨行——rowspan
6.4 表格嵌套
6.5 表格的按行分组显示//
6.6 综合实例——表格应用
6.6.1 表格显示数据
6.6.2 使用表格布局
习题
第7章 表单
7.1 表单概述
7.2 建立表单
7.3 表单控件
7.3.1 文本框和密码框
7.3.2 提交按钮、重置按钮和普通按钮
7.3.3 单选按钮
7.3.4 复选框
7.3.5 文件域
7.3.6 图像域
7.3.7 多行文字框
7.3.8 列表
7.4 表单高级元素使用
7.4.1 url属性
7.4.2 email属性
7.4.3 date和Times
7.4.4 number属性
7.4.5 range属性
7.4.6 color属性
7.4.7 fieldset控件组
7.4.8 其他类型的输入表单控件
7.5 通用的表单属性
7.5.1 表单重写属性
7.5.2 form属性
7.5.3 autofocus属性
7.5.4 multiple属性
7.5.5 placeholder属性
7.5.6 required属性
7.5.7 pattern属性
7.6 综合实例——表单设计
习题
第8章 CSS语法基础
8.1 CSS介绍
8.1.1 CSS概述
8.1.2 CSS3
8.2 CSS的基本语法
8.3 在HTML文档中使用CSS的方法
8.3.1 行内样式
8.3.2 内嵌样式
8.3.3 链接外部样式
8.3.4 导入外部样式
8.4 CSS元素选择符
8.4.1 标记选择符
8.4.2 通用选择符
8.4.3 类选择符
8.4.4 id选择符
8.5 其他CSS选择符
8.5.1 伪类选择符
8.5.2 伪对象选择符
8.5.3 组合选择符
8.5.4 关系选择符
8.5.5 属性选择符
8.6 综合案例——CSS的简单应用
习题
第9章 CSS字体与段落
9.1 颜色color
9.2 字体属性
9.2.1 设置字体font-family
9.2.2 设置字号font-size
9.2.3 设置字体风格font-style
9.2.4 设置字体加粗font-weight
9.2.5 设置小型大写字母font-variant
9.2.6 字体复合属性font
9.3 文本高级样式
9.3.1 行高line-height
9.3.2 文本缩进text-indent
9.3.3 水平对齐方式text-align
9.3.4 垂直对齐方式vertical-align
9.3.5 大小写text-transform
9.3.6 单词间距word-spacing
9.3.7 字符间隔letter-spacing
9.3.8 文本修饰text-decoration
9.3.9 文本阴影text-shadow
9.4 综合实例——简单图文混排网页
习题
第10章 CSS盒子
10.1 基本的盒子BOX概念
10.1.1 盒子的基本形式
10.1.2 盒子大小的计算width/height
10.1.3 改变盒子大小的计算方式box-sizing
10.2 基本边框属性
10.2.1 边框样式
10.2.2 边框线宽
10.2.3 边框颜色
10.2.4 边框复合属性
10.3 补白
10.3.1 内补白
10.3.2 外补白
10.4 其他边框属性
10.4.1 圆角边框
10.4.2 图像边框
10.4.3 盒子阴影box-shadow
10.4.4 BOX线条外廓
10.5 综合案例——简单地产网页
习题
第11章 CSS颜色和背景
11.1 背景颜色
11.1.1 网页背景颜色background-color
11.1.2 用背景色给页面分块
11.2 背景图像
11.2.1 页面背景图像background-image
11.2.2 背景图像重复background-repeat
11.2.3 背景图像滚动background-attachment
11.2.4 背景图像位置background-position
11.2.5 背景显示区域background-origin
11.2.6 背景图像大小background-size
11.2.7 背景图像裁剪区域background-clip
11.2.8 背景复合属性background
11.3 定义透明度
11.4 综合实例——设置背景
习题
第12章 CSS美化其他页面元素
12.1 超链接特效
12.1.1 超链接样式变换
12.1.2 按钮式超链接
12.2 鼠标特效
12.2.1 鼠标指针形状
12.2.2 鼠标变换的超链接
12.3 项目列表
12.3.1 列表符号list-style-type
12.3.2 图片符号list-style-image
12.3.3 列表位置list-style-position
12.3.4 列表综合设置list-style
12.3.5 使用列表制作菜单
12.3.6 下拉菜单
12.4 综合实例——Tab菜单
习题
第13章 用CSS美化表格与表单
13.1 表格的基本样式
13.1.1 表格边框样式
13.1.2 表格颜色
13.1.3 盒子阴影
13.2 和
13.2.1 标记
13.2.2 标记
13.2.3 分组
13.2.4 和组合应用
13.3 表格综合实例
13.4 CSS美化表单
13.4.1 美化表单元素边框
13.4.2 美化表单元素颜色
13.4.3 美化表单元素背景图像
13.4.4 按钮样式
13.5 表格表单综合实例——调查问卷
13.5.1 页面布局设计
13.5.2 标题栏的设计
13.5.3 题目区的设计
第14章 CSS定位、布局与分栏
14.1 理解CSS定位与div布局
14.1.1
14.1.2
14.2 CSS元素的定位
14.2.1 定位方式——position
14.2.2 设置位置——top、bottom、right、left
14.2.3 堆叠次序——z-index
14.3 CSS布局属性
14.3.1 可见性——visibility
14.3.2 剪裁——clip
14.3.3 溢出——overflow
14.3.4 浮动——float
14.3.5 清除——clear
14.4 CSS分栏
14.4.1 列——columns
14.4.2 平衡列——column-fill
14.4.3 列间距——column-gap
14.4.4 列边框样式——column-rule
14.4.5 跨列样式——column-span
14.5 综合案例——页面分块布局
习题
第15章 DIV+CSS布局
15.1 CSS排版概念
15.1.1 将页面用div分块
15.1.2 设计各分块位置
15.1.3 设计各分块细节
15.2 页面布局方式
15.2.1 上中下结构布局
15.2.2 左右结构布局
15.2.3 “国”字形结构
15.2.4 隐藏布局
15.3 各种布局版式
15.3.1 骨骼型版式
15.3.2 对称型版式
15.3.3 满版型版式
15.3.4 其他版式
15.4 综合案例——DIV+CSS布局综合应用
15.4.1 首页设计
15.4.2 详细页面设计
习题
第16章 网页编辑工具Dreamweaver
16.1 Dreamweaver工具介绍
16.1.1 Dreamweaver软件概述
16.1.2 DreamweaverCS5.5软件介绍
16.1.3 Dreamweaver的工作流程
16.2 使用Dreamweaver设计网页
16.2.1 创建站点和组织站点结构
16.2.2 设计并创建网页
16.3 使用Dreamweaver设定CSS样式
16.3.1 CSS样式在Dreamweaver中设定的基础知识
16.3.2 CSS样式的创建和应用案例
16.4 使用Dreamweaver编码
16.4.1 使用Dreamweaver对网页编码的常识
16.4.2 使用Dreamweaver编码的编辑思路
16.4.3 使用Dreamweaver编码的案例
16.5 综合实例——使用Dreamweaver制作网页
16.5.1 规划和设置站点
16.5.2 设计网页布局
16.5.3 添加页面内容
16.5.4 通过手动编码创建页面
16.5.5 测试和发布
习题
第17章 综合案例——宝贝花园
17.1 网页布局概述
17.2 首页的设计
17.3 主标题区
17.3.1 网页首部
17.3.2 标题新闻区
17.4 主内容区
17.4.1 滚动字幕区
17.4.2 主内容区
17.5 页尾区
17.6 内容页的设计
17.7 联系页面的设计
17.7.1 页面布局
17.7.2 左侧栏
17.7.3 右侧栏
第18章 综合案例——购物网站
18.1 首页设计
18.1.1 首页页面布局
18.1.2 首页头部设计
18.1.3 主体部分设计
18.1.4 脚注部分设计
18.2 内容页设计
18.2.1 商品分类信息页
18.2.2 单类商品信息页
第19章 综合案例——中秋节网站
19.1 节日类网站设计分析
19.2 实例制作——中秋节网站设计
19.2.1 中秋节网站策划
19.2.2 主页和内页效果
19.2.3 网站主页的设计
19.2.4 网站内页的设计