Web前端开发实战教程

本书共分11章，其中第1～2章主要讲解了HTML标签及属性的应用，结合两个实战项目帮助读者更好地理解相关知识点。第3～6章主要讲解CSS的应用，通过引入4个项目实战并讲解开发思路，对各知识点的应用进行深入分析，同时也提供完整的代码实现。第7～11章则讲解JavaScript程序设计，包括JavaScript的基础语法、JavaScript内置对象的应用、JavaScript对DOM和BOM的操作，以及如何响应用户的鼠标和键盘操作等，均附有大量的实例应用代码，结合5个项目实战案例，帮助读者深入理解程序设计的原理与应用。同时，本书完全利用原生的JavaScript来实现常见的Web页面功能，不借助于任何第三方框架，也是希望能够帮助读者从原理上对Web页面的功能实现有所理解，进而帮助大家打下扎实的基本功。
【目录】
第1章 HTML核心基础　1

1.1　了解Web系统　2

1.1.1　网络体系结构　2

1.1.2　B/S架构的特点　2

1.1.3　页面渲染引擎　3

1.2　HTML开发基础　3

1.2.1　HTML简介　3

1.2.2　*个HTML页面　5

1.2.3　WebStorm开发工具　6

1.2.4　其他开发工具　11

1.3　HTML常用标签　11

1.3.1　文本　11

1.3.2　超链接　12

1.3.3　图像　14

1.3.4　表格　17

1.3.5　表单元素　22

1.3.6　列表　23

1.3.7　滚动字幕　24

1.3.8　音频/视频播放　26

1.3.9　其他标签　28

第2章　HTML项目实战　31

2.1　在线计算器　32

2.1.1　项目介绍　32

2.1.2　开发思路　32

2.1.3　代码实现　33

2.2　蜗牛学院官网　35

2.2.1　项目介绍　35

2.2.2　开发思路　35

2.2.3　代码实现　36

第3章　CSS核心基础　40

3.1　CSS基础　41

3.1.1　CSS简介　41

3.1.2　CSS的特点　41

3.1.3　CSS的使用　42

3.2　CSS选择器　43

3.2.1　标签选择器　43

3.2.2　ID选择器　45

3.2.3　Class选择器　47

3.2.4　组合选择器　49

3.2.5　伪类选择器　50

3.3　CSS元素样式　52

3.3.1　文本与图像　52

3.3.2　表格　54

3.3.3　超链接　56

3.3.4　列表　57

3.3.5　表单　58

第4章　盒模型　60

4.1　盒模型基础知识　61

4.1.1　盒模型简介　61

4.1.2　盒模型属性　61

4.1.3　盒模型基础使用　62

4.2　盒模型浮动　64

4.2.1　浮动的作用　64

4.2.2　盒模型左浮动　65

4.2.3　盒模型右浮动　66

4.2.4　禁止浮动　67

4.3　盒模型内容　67

4.3.1　宽度与高度　67

4.3.2　水平居中　69

4.3.3　垂直居中　71

4.3.4　内容溢出　73

4.4　盒模型嵌套　76

4.4.1　嵌套的作用　76

4.4.2　嵌套的排版　76

4.5　盒模型定位　78

4.5.1　定位简介　78

4.5.2　固定定位　79

4.5.3　*定位　82

4.5.4　相对定位　83

4.5.5　其他属性　84

第5章　布局项目实战　85

5.1　九宫格布局　86

5.1.1　项目介绍　86

5.1.2　开发思路　86

5.1.3　代码实现　87

5.2　在线计算器布局　88

5.2.1　项目介绍　88

5.2.2　开发思路　89

5.2.3　代码实现　89

5.3　蜗牛学院官网布局　92

5.3.1　项目介绍　92

5.3.2　开发思路　92

5.3.3　代码实现　94

5.3.4　代码优化　105

第6章　CSS高级应用　106

6.1　动画效果　107

6.1.1　animation　107

6.1.2　transform　113

6.1.3　transition　119

6.2　响应式布局　121

6.2.1　响应式布局简介　121

6.2.2　媒体查询　122

6.3　项目实战　126

6.3.1　实现一个立方体　126

6.3.2　实现立方体运动　128

第7章　JavaScript程序设计　131

7.1　语法基础　132

7.1.1　JavaScript简介　132

7.1.2　输入与输出　133

7.1.3　变量与数据类型　135

7.1.4　分支语句　138

7.1.5　循环语句　142

7.2　基础编程练习　144

7.2.1　练习题目　144

7.2.2　循环求和　145

7.2.3　字符判断　145

7.2.4　密码验证　147

7.2.5　水仙花数　148

7.2.6　次方计算　149

7.2.7　统计字符　150

7.2.8　抓球问题　150

7.2.9　九九乘法表　151

7.2.10　字符串判断　152

7.3　数组　154

7.3.1　定义与使用　154

7.3.2　核心算法　155

7.3.3　排序算法　156

7.3.4　多维数组　157

7.3.5　数组对象　158

7.3.6　数组练习　159

7.4　函数　163

7.4.1　函数定义　163

7.4.2　可选参数　165

7.4.3　匿名函数　165

7.4.4　函数应用　166

7.5　字符串　172

7.5.1　字符串的属性　172

7.5.2　字符串的方法　172

7.5.3　字符串的应用　173

第8章　文档对象模型　177

8.1　Document对象　178

8.1.1　对象集合　178

8.1.2　对象属性　180

8.1.3　对象方法　181

8.2　查找DOM元素　182

8.2.1　DOM简介　182

8.2.2　通过ID查找　183

8.2.3　通过标签查找　185

8.2.4　通过Class查找　186

8.2.5　通过Name查找　188

8.2.6　DOM操作练习　188

8.3　操作DOM元素　192

8.3.1　DOM的属性与方法　192

8.3.2　DOM的新增　194

8.3.3　DOM的删除　195

8.3.4　DOM的修改　196

8.3.5　针对表格的操作　197

第9章　JavaScript对象　204

9.1　Window对象　205

9.1.1　BOM简介　205

9.1.2　窗口对象　206

9.1.3　弹出窗口　208

9.1.4　弹出框对象　209

9.1.5　定时器对象　209

9.1.6　其他对象　210

9.2　异常处理机制　211

9.2.1　异常处理机制简介　211

9.2.2　使用onerror处理异常　211

9.2.3　使用try…catch处理异常　212

9.3　正则表达式　213

9.3.1　正则表达式简介　213

9.3.2　正则表达式语法　213

9.3.3　RegExp对象　215

第10章　事件处理　217

10.1　鼠标事件　218

10.1.1　鼠标事件列表　218

10.1.2　鼠标单击实例　218

10.1.3　鼠标悬停实例　220

10.2　键盘事件　221

10.2.1　键盘事件及属性　221

10.2.2　检测按键实例　222

10.2.3　只接受数字输入　224

10.3　表单事件　224

10.3.1　表单事件简述　224

10.3.2　密码对比实例　225

10.3.3　动态城市联动　226

10.4　多媒体事件　227

10.4.1　多媒体事件列表　227

10.4.2　记录播放时间　228

第11章　JavaScript项目实战　230

11.1　*飘雪　231

11.1.1　项目介绍　231

11.1.2　开发思路　231

11.1.3　代码实现　233

11.1.4　思维拓展　236

11.2　在线计算器　237

11.2.1　项目介绍　237

11.2.2　开发思路　238

11.2.3　代码实现　239

11.2.4　思维拓展　241

11.3　在线时钟　242

11.3.1　项目介绍　242

11.3.2　开发思路　243

11.3.3　代码实现　243

11.4　倒计时程序　245

11.4.1　项目介绍　245

11.4.2　开发思路　246

11.4.3　代码实现　246

11.4.4　思维拓展　251

11.5　图片轮播　252

11.5.1　项目介绍　252

11.5.2　开发思路　252

11.5.3　代码实现　253

11.5.4　思维拓展　258