本书为“十四五”职业教育国家规划教材。
本书将网页制作课程中使用频率较高、具有代表性的案例按照知识点进行归纳、整理,组成8 个单元,内容包括HTML 静态网站开发概述、HTML5 中的常用标签、CSS 的使用、CSS 布局初探、表格基本知识、页面布局基础Bootstrap 响应式网站基础以及网站开发综合案例。本书采用了支持HTML5 的Web 集成开发环境—HBuilder 作为开发工具,不仅提供了PC 端网站的制作案例,还介绍了基于Bootstrap 框架的响应式网站的案例以及WebApp 的制作方法,为学习后续的专业课程奠定基础。
本书配有微课视频、授课用PPT、课程标准、教学日历、案例素材、源代码等丰富的数字化学习资源。与本书配套的数字课程“移动Web 开发”在“智慧职教”平台(www.icve.com.cn)上线,学习者可登录平台进行在线学习,授课教师可调用本课程构建符合自身教学特色的SPOC 课程,详见“智慧职教”服务指南。本书同时配有MOOC 课程,学习者可访问“智慧职教MOOC 学院”(mooc.icve.com.cn)进行在线开放课程学习。教师也可发邮件至编辑邮箱1548103297@qq.com 获取相关资源。
本书内容由浅入深,循序渐进,适合作为高职高专院校网页开发课程的基础教材,也可作为网页设计开发人员的参考用书。
- 前辅文
- 单元1 HTML5 静态网站开发概述
- 任务1-1 常用HTML5 开发环境的搭建
- 任务1-2 完成第一个HTML5 页面
- 单元小结
- 单元2 HTML5 中的常用标签
- 任务2-1 使用<marquee>标签制作滚动字幕
- 任务2-2 使用<a>标签实现超链接
- 任务2-3 使用<a>标签实现锚点链接
- 任务2-4 使用文本类标签实现页面文本的显示
- 任务2-5 使用文本格式类属性实现页面文本特殊显示效果
- 任务2-6 使用转义字符显示特殊符号
- 任务2-7 使用图像类标签显示图像及图像映射
- 任务2-8 <iframe>标签的使用
- 任务2-9 使用<audio>和<video>标签实现音视频播放
- 任务2-10 表单的简单应用
- 任务2-11 制作文本编辑器页面
- 任务2-12 表单格式验证
- 单元小结
- 单元3 CSS 的使用
- 任务3-1 使用CSS 设置页面样式
- 任务3-2 使用CSS 详细设置不同段落样式
- 任务3-3 全局样式和局部样式的使用
- 任务3-4 样式的并列和从属关系的应用
- 任务3-5 样式优先级的测试
- 任务3-6 使用伪类选择器定义超链接的显示效果
- 任务3-7 创建盒子模型
- 任务3-8 CSS 浮动(float)属性的使用
- 任务3-9 常用文本样式属性的使用
- 任务3-10 常用图片样式属性的使用
- 任务3-11 在CSS3 中使用图片背景
- 单元小结
- 单元4 CSS 布局初探
- 任务4-1 绝对定位
- 任务4-2 相对定位
- 任务4-3 绝对、相对组合定位
- 任务4-4 z-index 定位
- 任务4-5 固定定位
- 任务4-6 网页布局实现
- 任务4-7 clearfix 和clear 的使用
- 单元小结
- 单元5 表格基本知识
- 任务5-1 表格的基本属性及使用
- 任务5-2 表格的基本操作
- 任务5-3 制作细边框表格
- 任务5-4 表格宽高百分比设置
- 任务5-5 表格宽度、列宽度和行高度的设置
- 任务5-6 使用CSS3:nth-child()选择器设置表格隔行变色
- 任务5-7 使用伪类选择器:hover 实现鼠标移上去行变色
- 任务5-8 使用表格及其他相关元素制作个人简历
- 任务5-9 使用表格制作QQ 邮箱
- 单元小结
- 单元6 页面布局基础
- 任务6-1 页面中的图文混排
- 任务6-2 页面内容溢出的处理
- 任务6-3 纯CSS 制作选项卡
- 任务6-4 导航条的制作
- 任务6-5 制作带有背景图像的导航条
- 任务6-6 制作新闻文字列表
- 任务6-7 制作新闻图文混排列表
- 任务6-8 制作缩略图列表
- 任务6-9 登录界面的制作
- 任务6-10 960 网格系统在网页制作中的使用
- 任务6-11 三种经典布局
- 任务6-12 使用基于lib-flexible 库的rem 单位制作自适应网页
- 单元小结
- 单元7 Bootstrap 响应式网站基础
- 任务7-1 掌握Bootstrap 基础知识
- 任务7-2 制作栅格化布局页面
- 任务7-3 制作响应式导航栏
- 任务7-4 制作响应式banner 图片
- 任务7-5 制作响应式文字列表
- 任务7-6 制作响应式缩略图
- 任务7-7 制作响应式图文混排列表
- 任务7-8 制作响应式图文混排内容
- 任务7-9 制作响应式表格
- 任务7-10 制作响应式表单
- 任务7-11 制作响应式提示框
- 任务7-12 制作完整的响应式网站
- 单元小结
- 单元8 网站开发综合案例
- 任务8-1 古色古香网站制作
- 任务8-2 校园网站制作
- 任务8-3 企业网站制作
- 任务8-4 期末大作业
- 单元小结
- 参考文献