Web前端技术开发：HTML5+CSS3+JavaScript / “十四五”高等职业教育计算机类专业系列教材
定价：￥49.80
作者： 高莺，尤澜涛
出版时间：2024-08
最新印次日期：2024-8
出版社：中国铁道出版社
- 中国铁道出版社
- 9787113313685
- 1版
- 531538
- 68260697-5
- 16开
- 2024-08
- 电子与信息大类
- 计算机类
- 计算机类
- 高职
作者简介
内容简介
本书是“十四五”高等职业教育计算机类专业系列教材之一，主要围绕HTML5、CSS3、JavaScript相关技术讲解网页设计与制作。全书分三篇：基础篇、提高篇、应用篇。基础篇主要介绍Web前端技术开发的基本概念，HTML、CSS、JavaScript三者在网页开发中各自扮演的角色，网页开发环境与工具，制作图文并茂的页面，表格的应用，表单的应用，通过HTML5搭建文本、图像、超链接、表格、表单等网页内容。提高篇主要介绍CSS基础知识、字体样式设置、文本精细排版、背景设置、层与区块的页面布局、多媒体元素、Canvas元素等，着重介绍CSS代码开发。应用篇主要介绍列表的应用，JavaScript、jQuery脚本语言的基础开发，使用Bootstrap前端开发框架进行综合网站开发的案例。
本书基于案例教学的思想，所有实例均具有代表性和实用性，系统学习后能使读者快速掌握网页制作的相关技术，迅速进入Web页面的实战开发。
本书适合作为高等职业院校Web前端技术开发课程的教材。
本书基于案例教学的思想，所有实例均具有代表性和实用性，系统学习后能使读者快速掌握网页制作的相关技术，迅速进入Web页面的实战开发。
本书适合作为高等职业院校Web前端技术开发课程的教材。
目录
基 础 篇
网页开发入门2
1.1网页基础知识2
1.1.1网页与网站2
1.1.2经典网页赏析3
1.1.3浏览器的兼容性问题5
1.2 HTML、CSS、JavaScript三者扮演的角色5
1.2.1HTML与HTML5的概念5
1.2.2CSS与CSS3的概念7
1.2.3JavaScript介绍9
1.3 网页开发环境与工具10
1.3.1网页开发环境的种类10
1.3.2浏览器的标准模式和混杂模式13
图文并茂的页面制作14
2.1XHTML与文档类型声明14
2.2HTML基础语法16
2.2.1HTML标记16
2.2.2HTML标记属性17
2.2.3添加HTML注释18
2.3HTML文档整体结构20
2.3.1文档头部20
2.3.2文档主体22
2.4 添加段落23
2.5 添加标题24
2.6 文本修饰24
2.6.1设置文本加粗25
2.6.2设置文本倾斜25
2.6.3设置下画线25
2.7 特殊字符26
2.8 图片与超链接27
2.8.1设置图片27
2.8.2添加超链接29
2.8.3绝对路径与相对路径30
2.9 HTML文件命名及代码编写32
实训任务 花卉图片展页面制作32
技能训练 苏州园林景点介绍页面制作34
表格的应用35
3.1 创建表格35
3.1.1 表格的基本构成35
3.1.2 设置表格的标题37
3.1.3添加表头38
3.2 表格属性设置39
3.2.1 设置表格边框样式39
3.2.2 设置宽度和高度41
3.2.3 设置对齐方式44
3.2.4边距与填充47
3.2.5 背景色设置49
3.3跨行和跨列操作51
3.3.1 跨列操作51
3.3.2跨行操作52
3.4表格嵌套54
实训任务使用表格嵌套制作销售员个人主页55
技能训练插件中心的设计与制作57
HTML5表单的应用58
4.1 创建表单58
4.2 表单输入控件59
4.2.1定义单行文本框60
4.2.2定义密码框62
4.2.3定义单选按钮62
4.2.4定义复选框63
4.2.5定义标准按钮64
4.2.6定义提交按钮65
4.2.7定义重置按钮66
4.2.8定义图像域67
4.2.9定义隐藏域68
4.2.10定义文件域69
4.2.11定义日期选择器70
4.2.12定义拾色器70
4.2.13定义数值域文本框71
4.2.14定义数值域滑动条72
4.3定义下拉列表73
4.4定义文本域74
4.5 定义标签76
4.6 HTML5表单数据内容变化77
4.6.1HTML5数据提交格式77
4.6.2HTML5数据提交范围77
4.6.3HTML5中增加表单数据类型和控件标记77
4.6.4新增HTML5表单控件属性77
实训任务 登录表单的制作81
技能训练 注册页面的设计与制作82
提 高 篇
使用CSS美化页面84
5.1CSS基础84
5.1.1CSS样式表的概念84
5.1.2CSS的选择器84
5.1.3CSS样式表引入方式89
5.2CSS字体样式设置90
5.2.1设置字体90
5.2.2设置字体大小92
5.2.3设置字体样式-font-style94
5.2.4设置字体加粗-font-weight96
5.2.5设置字体变体97
5.2.6设置组合字体属性98
5.2.7设置文字颜色-color99
5.3 文本精细排版101
5.3.1添加文本修饰101
5.3.2 设置文本对齐方式103
5.3.3 设置文本缩进104
5.3.4 调整行高105
5.3.5 转换英文大小写-text-transform107
5.4背景设置108
5.4.1设置背景颜色108
5.4.2插入背景图片110
5.4.3设置重复背景图片111
5.4.4插入背景附件112
5.4.5设置背景图片位置113
5.4.6设置背景组合属性114
实训任务 百度搜索结果页面的样式设计与制作116
技能训练 新浪新闻页面的制作117
层与区块的页面布局118
6.1 CSS布局基础118
6.1.1 文档流的概念118
6.1.2 块级元素与行内元素119
6.2 创建层119
6.3 盒子模型120
6.4 边框属性122
6.5 填充属性126
6.6 边距属性127
6.7 元素浮动129
6.8 清除浮动136
6.9 元素定位138
6.9.1绝对定位139
6.9.2相对定位143
6.9.3z-index空间位置144
实训任务 “厂”字形页面布局设计145
技能训练 DIV+CSS页面布局建站149
多媒体页面设计150
7.1 HTML5多媒体元素150
7.1.1HTML5音频150
7.1.2HTML5视频152
7.1.3使用DOM控制播放154
7.2 HTML5Canvas元素158
7.2.1Canvas属性设置159
7.2.2Canvas常用方法介绍160
实训任务音乐盒的设计与制作164
技能训练笑脸的绘制166
应 用 篇
列表的应用168
8.1 列表的建立与使用168
8.1.1列表类型168
8.1.2无序列表169
8.1.3有序列表170
8.2嵌套列表171
8.3CSS设置列表样式172
8.3.1设置列表样式172
8.3.2添加列表图像173
8.4 列表结合CSS的应用174
实训任务 水平导航栏的制作176
技能训练排行榜的设计与制作183
JavaScript基础184
9.1JavaScript概要184
9.1.1什么是JavaScript184
9.1.2JavaScript的特点184
9.2JavaScript的用法185
9.3JavaScript的常量与变量186
9.3.1标识符186
9.3.2注释186
9.3.3数据类型187
9.3.4常量187
9.3.5 变量188
9.4JavaScript的运算符188
9.4.1算术运算符188
9.4.2比较运算符190
9.4.3逻辑运算符190
9.5 流程控制结构193
9.5.1顺序结构193
9.5.2选择结构193
9.5.3 循环结构200
9.6 函数203
9.7 对象205
9.7.1HTML DOM概念206
9.7.2对象的属性206
9.7.3对象的方法207
9.7.4常用对象207
9.8 事件212
9.9 jQuery脚本编程214
9.9.1jQuery介绍214
9.9.2jQuery的特点214
9.9.3jQuery应用215
9.9.4jQuery选择器216
9.9.5jQuery中的DOM操作219
9.9.6jQuery中的事件和动画221
9.9.7jQuery表单和表格的应用224
实训任务 登录页面制作227
技能训练 简易Web计算器功能的实现231
综合案例实战232
10.1 网站设计和准备232
10.1.1内容设计232
10.1.2Bootstrap的应用233
10.2首页制作234
10.2.1大背景图片的自适应布局234
10.2.2页面浮动元素的制作235
10.3子栏目页面的制作237
10.3.1景点列表的制作237
10.3.2住宿列表的制作239
10.3.3交通列表的制作241
10.4 详情页面的制作242
10.4.1景点详情页面的制作242
10.4.2住宿详情页面的制作243
网页开发入门2
1.1网页基础知识2
1.1.1网页与网站2
1.1.2经典网页赏析3
1.1.3浏览器的兼容性问题5
1.2 HTML、CSS、JavaScript三者扮演的角色5
1.2.1HTML与HTML5的概念5
1.2.2CSS与CSS3的概念7
1.2.3JavaScript介绍9
1.3 网页开发环境与工具10
1.3.1网页开发环境的种类10
1.3.2浏览器的标准模式和混杂模式13
图文并茂的页面制作14
2.1XHTML与文档类型声明14
2.2HTML基础语法16
2.2.1HTML标记16
2.2.2HTML标记属性17
2.2.3添加HTML注释18
2.3HTML文档整体结构20
2.3.1文档头部20
2.3.2文档主体22
2.4 添加段落23
2.5 添加标题24
2.6 文本修饰24
2.6.1设置文本加粗25
2.6.2设置文本倾斜25
2.6.3设置下画线25
2.7 特殊字符26
2.8 图片与超链接27
2.8.1设置图片27
2.8.2添加超链接29
2.8.3绝对路径与相对路径30
2.9 HTML文件命名及代码编写32
实训任务 花卉图片展页面制作32
技能训练 苏州园林景点介绍页面制作34
表格的应用35
3.1 创建表格35
3.1.1 表格的基本构成35
3.1.2 设置表格的标题37
3.1.3添加表头38
3.2 表格属性设置39
3.2.1 设置表格边框样式39
3.2.2 设置宽度和高度41
3.2.3 设置对齐方式44
3.2.4边距与填充47
3.2.5 背景色设置49
3.3跨行和跨列操作51
3.3.1 跨列操作51
3.3.2跨行操作52
3.4表格嵌套54
实训任务使用表格嵌套制作销售员个人主页55
技能训练插件中心的设计与制作57
HTML5表单的应用58
4.1 创建表单58
4.2 表单输入控件59
4.2.1定义单行文本框60
4.2.2定义密码框62
4.2.3定义单选按钮62
4.2.4定义复选框63
4.2.5定义标准按钮64
4.2.6定义提交按钮65
4.2.7定义重置按钮66
4.2.8定义图像域67
4.2.9定义隐藏域68
4.2.10定义文件域69
4.2.11定义日期选择器70
4.2.12定义拾色器70
4.2.13定义数值域文本框71
4.2.14定义数值域滑动条72
4.3定义下拉列表73
4.4定义文本域74
4.5 定义标签76
4.6 HTML5表单数据内容变化77
4.6.1HTML5数据提交格式77
4.6.2HTML5数据提交范围77
4.6.3HTML5中增加表单数据类型和控件标记77
4.6.4新增HTML5表单控件属性77
实训任务 登录表单的制作81
技能训练 注册页面的设计与制作82
提 高 篇
使用CSS美化页面84
5.1CSS基础84
5.1.1CSS样式表的概念84
5.1.2CSS的选择器84
5.1.3CSS样式表引入方式89
5.2CSS字体样式设置90
5.2.1设置字体90
5.2.2设置字体大小92
5.2.3设置字体样式-font-style94
5.2.4设置字体加粗-font-weight96
5.2.5设置字体变体97
5.2.6设置组合字体属性98
5.2.7设置文字颜色-color99
5.3 文本精细排版101
5.3.1添加文本修饰101
5.3.2 设置文本对齐方式103
5.3.3 设置文本缩进104
5.3.4 调整行高105
5.3.5 转换英文大小写-text-transform107
5.4背景设置108
5.4.1设置背景颜色108
5.4.2插入背景图片110
5.4.3设置重复背景图片111
5.4.4插入背景附件112
5.4.5设置背景图片位置113
5.4.6设置背景组合属性114
实训任务 百度搜索结果页面的样式设计与制作116
技能训练 新浪新闻页面的制作117
层与区块的页面布局118
6.1 CSS布局基础118
6.1.1 文档流的概念118
6.1.2 块级元素与行内元素119
6.2 创建层119
6.3 盒子模型120
6.4 边框属性122
6.5 填充属性126
6.6 边距属性127
6.7 元素浮动129
6.8 清除浮动136
6.9 元素定位138
6.9.1绝对定位139
6.9.2相对定位143
6.9.3z-index空间位置144
实训任务 “厂”字形页面布局设计145
技能训练 DIV+CSS页面布局建站149
多媒体页面设计150
7.1 HTML5多媒体元素150
7.1.1HTML5音频150
7.1.2HTML5视频152
7.1.3使用DOM控制播放154
7.2 HTML5Canvas元素158
7.2.1Canvas属性设置159
7.2.2Canvas常用方法介绍160
实训任务音乐盒的设计与制作164
技能训练笑脸的绘制166
应 用 篇
列表的应用168
8.1 列表的建立与使用168
8.1.1列表类型168
8.1.2无序列表169
8.1.3有序列表170
8.2嵌套列表171
8.3CSS设置列表样式172
8.3.1设置列表样式172
8.3.2添加列表图像173
8.4 列表结合CSS的应用174
实训任务 水平导航栏的制作176
技能训练排行榜的设计与制作183
JavaScript基础184
9.1JavaScript概要184
9.1.1什么是JavaScript184
9.1.2JavaScript的特点184
9.2JavaScript的用法185
9.3JavaScript的常量与变量186
9.3.1标识符186
9.3.2注释186
9.3.3数据类型187
9.3.4常量187
9.3.5 变量188
9.4JavaScript的运算符188
9.4.1算术运算符188
9.4.2比较运算符190
9.4.3逻辑运算符190
9.5 流程控制结构193
9.5.1顺序结构193
9.5.2选择结构193
9.5.3 循环结构200
9.6 函数203
9.7 对象205
9.7.1HTML DOM概念206
9.7.2对象的属性206
9.7.3对象的方法207
9.7.4常用对象207
9.8 事件212
9.9 jQuery脚本编程214
9.9.1jQuery介绍214
9.9.2jQuery的特点214
9.9.3jQuery应用215
9.9.4jQuery选择器216
9.9.5jQuery中的DOM操作219
9.9.6jQuery中的事件和动画221
9.9.7jQuery表单和表格的应用224
实训任务 登录页面制作227
技能训练 简易Web计算器功能的实现231
综合案例实战232
10.1 网站设计和准备232
10.1.1内容设计232
10.1.2Bootstrap的应用233
10.2首页制作234
10.2.1大背景图片的自适应布局234
10.2.2页面浮动元素的制作235
10.3子栏目页面的制作237
10.3.1景点列表的制作237
10.3.2住宿列表的制作239
10.3.3交通列表的制作241
10.4 详情页面的制作242
10.4.1景点详情页面的制作242
10.4.2住宿详情页面的制作243
