本书共10个模块，模块1～3介绍HTML知识，包括文件结构、开发环境和常用元素，如图像、音频、视频、超链接、表格、表单等元素的用法，完成了网页内容的设计。模块4～6介绍CSS基础知识，包括CSS语法、选择器和元素基本样式，重点介绍了元素的框模型和背景样式，基于图像背景和背景起点属性实现了图像精灵，完成了网页样式的初步设计。模块7～9介绍CSS3知识，包括定位、过渡、动画和布局的知识，基于定位、过渡和动画技术设计了轮播图像、菜单和幽灵按钮等典型网页效果，基于布局技术设计了常用网页布局，包括自适应响应式布局，完成了实用复杂网页和网页实用效果的设计。模块10为综合实训，仿照华为官网首页设计了一个网站首页，将全书内容进行了贯穿和升华，可用作课程配套的实训参考。本书可作为应用型本科或高职专科网页基础课程的教材；也可作为前端开发技术人员的技术参考资料、培训用书或自学参考用书；还可以作为1+X认证《Web前端开发》的初级认证培训教材。

摸摸1 Web开发概述
任务1.1 书写一封家信
1.1.1 Web标准
1.1.2 HTML文件
1.1.3 HTML项目
1.1.4 文本格式化元素
1.1.5 任务实现
任务1.2 设计一个公告
1.2.1 HTML注释
1.2.2 HTML头部元素
1.2.3 HTML元素分类
1.2.4 简单HTML元素
1.2.5 字符实体
1.2.6 元素的通用属性
1.2.7 任务实现
模块小结1
随堂测试1
课后实践1
模块2 常用HTML元素
任务2.1 设计一个海报
2.1.1 img元素
2.1.2 video元素
2.1.3 audio元素
2.1.4 object元素
2.1.5 任务实现
任务2.2 设计海报导航
2.2.1 a元素
2.2.2 列表元素
2.2.3 任务实现
任务2.3 设计网页底部导航
2.3.1 map元素
2.3.2 area元素
2.3.3 图像映射
2.3.4 任务实现
模块小结2
随堂测试2
课后实践2
模块3 表格与表单元素
任务3.1 设计通讯录表格
3.1.1 基本表格元素
3.1.2 复杂表格元素
3.1.3 任务实现
任务3.2 设计收货地址表单
3.2.1 form元素
3.2.2 input元素
3.2.3 下拉列表元素
3.2.4 textarea元素
3.2.5 任务实现
模块小结3
随堂测试3
课后实践3
模块4 CSS语法基础
任务4.1 规范海报样式设计
4.1.1 CSS语法规则
4.1.2 样式声明方式
4.1.3 简单CSS属性
4.1.4 简单选择器
4.1.5 任务实现
任务4.2 设计通讯录表格样式
4.2.1 层级选择器
4.2.2 伪类选择器
4.2.3 任务实现
任务4.3 规范书信的格式
4.3.1 伪元素选择器
4.3.2 属性选择器
4.3.3 任务实现
任务4.4 掌握样式优先级规则
4.4.1 声明方式的优先级
4.4.2 样式的三大特性
4.4.3 样式优先级规则
模块小结4
随堂测试4
课后实践4
模块5 元素框模型
任务5.1 使用框模型布局海报
5.1.1 元素框模型定义
5.1.2 边距
5.1.3 display属性
5.1.4 overflow属性
5.1.5 任务实现
任务5.2 设计一个展板
5.2.1 边框
5.2.2 圆角边框
5.2.3 box-sizing属性
5.2.4 任务实现
任务5.3 展板再设计
5.3.1 阴影
5.3.2 轮廓
5.3.3 任务实现
模块小结5
随堂测试5
课后实践5
模块6 元素背景
任务6.1 设计展板的详情
6.1.1 图像背景
6.1.2 渐变背景
6.1.3 任务实现
任务6.2 优化展板设计
6.2.1 图像背景相关的属性
6.2.2 background属性
6.2.3 图像精灵
6.2.4 任务实现
模块小结6
随堂测试6
课后实践6
模块7 元素定位
任务7.1 掌握定位的语法
7.1.1 定位属性
7.1.2 基本定位
7.1.3 黏性定位
任务7.2 应用子绝父相定位
7.2.1 设计内容标识
7.2.2 设计轮播图布局
7.2.3 设计下拉式菜单
7.2.4 设计弹出式菜单
模块小结7
随堂测试7
课后实践7
模块8 元素过渡与动画
任务8.1 掌握转换与过渡的语法
8.1.1 浏览器前缀
8.1.2 转换属性
8.1.3 过渡属性
任务8.2 设计过渡效果
8.2.1 设计欢迎动画
8.2.2 设计幽灵按钮
任务8.3 设计轮播图的动画
8.3.1 动画关键帧
8.3.2 动画属性
8.3.3 任务实现
模块小结8
随堂测试8
课后实践8
模块9 网页布局技术
任务9.1 设计浮动布局
9.1.1 float属性
9.1.2 clear属性
9.1.3 任务实现
任务9.2 设计响应式布局
9.2.1 网页视口
9.2.2 媒体查询
9.2.3 网格视图
9.2.4 任务实现
任务9.3 设计弹性布局
9.3.1 弹性布局相关概念
9.3.2 容器属性
9.3.3 项目属性
9.3.4 任务实现
模块小结9
随堂测试9
课后实践9
模块10 网站设计综合实训
任务10.1 设计网页布局
10.1.1 布局分析
10.1.2 布局设计
任务10.2 设计网页菜单
10.2.1 设计顶部导航主菜单
10.2.2 设计侧边帮助菜单
任务10.3 设计网页内容
10.3.1 设计轮播图
10.3.2 设计推荐信息
10.3.3 设计中分广告
10.3.4 设计新闻与活动
10.3.5 设计搜索框、链接与页脚
任务10.4 总结网站设计
附录 框架
参考文献