网页设计与制作案例教程(HTML+CSS+JavaScript)计算机系列

主     编 :马冬侠,冯淑杰,刘飞生

定     价 :49.00

书     号 :978-7-5121-5687-6

印 刷 色 :双色

出 版 社 :北京交通大学出版社

出版/修订日期:2025.11

分 享 到 :

微信扫码进入微店购买

产品介绍样书申请

目录
HTML 标签篇
项目 1 网站策划 3
任务 1.1 了解网站开发流程 4
    任务介绍 4
    任务分析 4
    任务准备 4
        1.1.1 网页和网站的基础知识 4
        1.1.2 网站的设计与开发 7
    任务实现 11
任务 1.2 搭建与管理网站 12
    任务介绍 12
    任务分析 12
    任务准备 13
        1.2.1 开发工具——HBuilder 13
        1.2.2 调试工具——Chrome 开发者工具 16
    任务实现 18
项目实施 撰写人工智能学院网站开发项目书 18
项目实训 设计网站内页效果图 21
项目总结 21
项目 2 HTML5 基础语法 22
任务 2.1 使用 HTML 创建一个空白网页 23
    任务介绍 23
    任务分析 23
    任务准备 23
        2.1.1 网页基本结构 23
        2.1.2 HTML5 元素的基本语法 24
        2.1.3 HTML5 文档头部标签 25
    任务实现 26
任务 2.2 制作图文网页 27
    任务介绍 27
    任务分析 27
    任务准备 28
        2.2.1 HTML 文本标签 28
        2.2.2 HTML 图像标签 29
        2.2.3 HTML 超链接 31
    任务实现 33
任务 2.3 使用列表标签 34
    任务介绍 34
    任务分析 34
    任务准备 34
        2.3.1 无序列表 34
        2.3.2 有序列表 35
        2.3.3 列表的嵌套应用 36
        2.3.4 定义列表 36
    任务实现 37
任务 2.4 使用表格标签 38
    任务介绍 38
    任务分析 38
    任务准备 38
        2.4.1 HTML 表格标签 38
        2.4.2 标签属性 39
    任务实现 43
任务 2.5 了解 HTML5 中新的元素 43
    任务介绍 43
    任务分析 44
    任务准备 44
        2.5.1 结构性标签 44
        2.5.2 页面交互标签 45
        2.5.3 新的多媒体元素 46
    任务实现 48
项目实施 编辑人工智能学院网站主页结构 49
项目实训 2022 年感动中国十大人物网站制作 55
项目总结 56
CSS 篇
项目 3 网页布局 59
任务 3.1 使用 CSS 修饰网页 60
    任务介绍 60
    任务分析 60
    任务准备 60
        3.1.1 认识 CSS 60
        3.1.2 CSS 的使用 61
        3.1.3 CSS 的继承与层叠 65
    任务实现 66
任务 3.2 使用盒子模型编辑网页 67
    任务介绍 67
    任务分析 67
    任务准备 68
        3.2.1 盒子模型 68
        3.2.2 盒子的边框 68
        3.2.3 盒子的边距 74
    任务实现 77
任务 3.3 使用盒子进行 CSS3 标准流布局 78
    任务介绍 78
    任务分析 79
    任务准备 79
        3.3.1 标准流布局 79
        3.3.2 外边距合并问题 82
    任务实现 83
任务 3.4 使用 CSS 浮动属性进行网页布局 85
    任务介绍 85
    任务分析 85
    任务准备 86
        3.4.1 元素的浮动属性 86
        3.4.2 清除浮动 88
    任务实现 91
任务 3.5 使用定位属性进行网页布局 92
    任务介绍 92
    任务分析 92
    任务准备 92
        3.5.1 认识 CSS 中的定位属性 92
        3.5.2 元素的堆叠顺序 97
        3.5.3 元素的溢出 98
    任务实现 99
任务 3.6 使用弹性盒子布局响应式页面 101
    任务介绍 101
    任务分析 101
    任务准备 102
        3.6.1 响应式布局的设计基础 102
        3.6.2 弹性布局 105
        3.6.3 浏览器兼容性 112
    任务实现 112
项目实施 编辑人工智能学院网站主页布局 114
项目实训 运用 CSS 对旅游网页进行布局 118
项目总结 119
项目 4 网页内容编辑 120
任务 4.1 使用 CSS 编辑网页中的文字 121
    任务介绍 121
    任务分析 121
    任务准备 121
        4.1.1 CSS 文字样式属性 122
        4.1.2 CSS 列表样式常用属性 127
        4.1.3 子元素伪类选择器 128
    任务实现 130
任务 4.2 使用 CSS 编辑图像 132
    任务介绍 132
    任务分析 132
    任务准备 132
        4.2.1 插入图像的编辑 133
        4.2.2 CSS 背景属性 134
        4.2.3 CSS3 新增背景属性 136
        4.2.4 CSS3 渐变 138
    任务实现 143
任务 4.3 使用 CSS 编辑导航栏 144
    任务介绍 144
    任务分析 144
    任务准备 145
        4.3.1 导航栏基础 145
        4.3.2 CSS 精灵技术 148
    任务实现 149
任务 4.4 使用 CSS 制作动画 152
    任务介绍 152
    任务分析 153
    任务准备 153
        4.4.1 过渡属性 153
        4.4.2 转换 156
        4.4.3 CSS3 的动画 163
    任务实现 167
任务 4.5 使用 CSS 美化表单 171
    任务介绍 171
    任务分析 171
    任务准备 171
        4.5.1 表单属性 171
        4.5.2 <input> 标签 172
        4.5.3 HTML5 新表单元素 176
        4.5.4 使用 CSS 修饰表单 177
    任务实现 179
项目实施 编辑人工智能学院网站主页内容 180
项目实训 运用 CSS 样式美化“环保”网页 188
项目总结 190
JavaScript 篇
项目 5 网页特效 193
任务 5.1 使用 JavaScript 实现网页 194
    任务介绍 194
    任务分析 194
    任务准备 194
        5.1.1 JavaScript 概述 194
        5.1.2 在网页中调用 JavaScript 195
    任务实现 195
任务 5.2 制作树形菜单 196
    任务介绍 196
    任务分析 196
    任务准备 197
    任务实现 197
任务 5.3 制作页面 Tab 选项卡切换效果 199
    任务介绍 199
    任务分析 200
    任务准备 200
    任务实现 201
任务 5.4 制作图片跑马灯效果 203
    任务介绍 203
    任务分析 204
    任务准备 204
        5.4.1 HTML DOM 元素对象 204
        5.4.2 setInterval() 函数 204
    任务实现 205
项目实施 编辑人工智能学院网站主页 banner 轮播图动画效果 207
项目实施 智算扩展:借助 AI 制作“人工智能学院”网站主页 210
项目实训 编辑手风琴效果 210
项目总结 211
参考文献 212

世纪宏图免费样书、课件申请表

尊敬的老师:

您好!欢迎您领取本书样书,高校教师免费领取,包邮,每人1-3本。提交申请样书信息后,由对应区域负责人安排邮寄,1-3天内寄出。如有其他问题,请联系:薛老师 13810412048 (微信同号) QQ: 2301407762 进行咨询和处理。

*1.样书申请人

姓名

电话

学校/院系/职务

邮箱

邮寄地址

2.样书申请

申请样书情况

申请样书书名

申请样书作者

申请样书出版社

*3.本学期使用教材

课程名称

教材书名

作者

出版社

全校使用数量

使用年限

4.评价建议

很不满意 不满意 一般 满意 很满意
知识体系完整性
内容新颖
数字化资源配套
习题解答配套
教师教学便利性

5.申请课件情况

验证码

换一张

提交申请

会员登录

期待您成为我们的会员!

用户名 *

密码 *

验证码*

换一张

忘记密码 用户注册

立即登录

会员注册

请认真填写您的资料*

用户名 *

密码 * (6-20个字符)

姓名*

电话*

邮箱*

学校名称*

所在院系*

职务*

地址*

验证码*

换一张

立即注册

找回密码

请输入您的邮箱找回密码!

邮箱*

验证码

下一步

设置新密码

请认真填写您的新密码!

验证码*

新密码*

确认密码*

提交 上一步

关注官方微信