本书为“十四五”职业教育国家规划教材。
本书将网页制作中使用频率较高、具有代表性的案例按照知识点和技能点归纳、整理,构建8个单元、55个任务,内容包括HTML5静态网站开发概述、HTML5中常用标签的使用、CSS基本应用、CSS3高级应用、页面局部布局、页面整体布局、Bootstrap5框架简介和HTML5综合案例。全书采用支持HTML5的Web集成开发环境—HBuilderX作为开发工具,不仅提供了大量个人计算机(PC)端网站制作案例,还介绍了基于Bootstrap5框架的响应式网站经典案例和WebApp自适应网站的制作方法,并深入浅出地讲解了HTML5+CSS3的各项知识及实战技能,为读者学习后续专业课程奠定基础。
本书配有微课视频、拓展阅读、授课用PPT、课程标准、教学日历、授课计划、案例素材、源代码、课后习题及解答等丰富的数字化学习资源。与本书配套的数字课程“HTML5+CSS3网页设计与制作”在“智慧职教”(www.icve.com.cn)及“中国大学MOOC”(www.icourse163.org)平台上线,学习者可登录相应平台进行在线学习,授课教师可调用本课程构建符合自身教学特色的SPOC课程,详见“智慧职教”服务指南及前言说明。授课教师也可登录“高等教育出版社产品信息检索系统”(xuanshu.hep.com.cn)搜索并下载本书配套教学资源,首次使用本系统的用户,请先进行注册并完成教师资格认证。
本书为高等职业院校计算机类专业的网页设计与制作类课程的教学用书,也可供广大网页设计开发人员参考使用。
- 前辅文
- 单元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 多媒体标签的使用
- 任务2-10 表单的简单应用
- 任务2-11 表单格式验证
- 单元小结
- 单元3 CSS基本应用
- 任务3-1 使用CSS设置body 样式
- 任务3-2 CSS元素选择器的使用
- 任务3-3 内联式、嵌入式、外部式样式的使用
- 任务3-4 测试样式优先级
- 任务3-5 创建盒子模型
- 任务3-6 CSS中float属性的使用
- 任务3-7 常用文本样式属性的使用
- 任务3-8 常用图片样式属性的使用
- 任务3-9 position的4种定位方式的使用
- 任务3-10 Chrome浏览器调试基本技巧
- 单元小结
- 单元4 CSS3高级应用
- 任务4-1 Font Awesome图标的使用
- 任务4-2 CSS3图片背景的使用
- 任务4-3 制作搜索框
- 任务4-4 制作无间隙滚动文字和图片
- 任务4-5 制作轮播文字和图片
- 任务4-6 制作多种文字特效
- 任务4-7 制作图片遮罩和悬停特效
- 单元小结
- 单元5 页面局部布局
- 任务5-1 图文混排与文字溢出
- 任务5-2 中英文混合标题
- 任务5-3 阅读更多内容
- 任务5-4 制作文字选项卡与图片选项卡
- 任务5-5 制作内容折叠与菜单折叠
- 任务5-6 制作导航条
- 任务5-7 制作文字列表、图文混排列表和缩略图列表
- 任务5-8 制作登录界面
- 任务5-9 制作评论区
- 单元小结
- 单元6 页面整体布局
- 任务6-1 960网格系统在网页制作中的使用
- 任务6-2 clearfix和clear的使用
- 任务6-3 常用经典布局
- 任务6-4 常用弹性布局
- 任务6-5 表格基本知识
- 任务6-6 使用表格制作个人简历
- 任务6-7 使用表格制作QQ邮箱
- 任务6-8 使用基于lib-flexible库的rem单位制作自适应网站
- 单元小结
- 单元7 Bootstrap5框架简介
- 任务7-1 Bootstrap5基础知识
- 任务7-2 制作栅格化布局页面
- 任务7-3 制作响应式导航栏
- 任务7-4 制作响应式轮播图
- 任务7-5 制作响应式文字和图片
- 任务7-6 制作完整的响应式网站
- 单元小结
- 单元8 HTML5综合案例
- 任务8-1 静态网页开发的基本流程
- 任务8-2 期末大作业
- 单元小结
- 参考文献