HTML5+CSS3+JavaScript前端开发基础2025|PDF|Epub|mobi|kindle电子书版本百度云盘下载

HTML5+CSS3+JavaScript前端开发基础PDF格式电子书版下载

注意：本站所有压缩包均有解压码： 点击下载压缩包解压工具

第1章 HTML5＋CSS3学习准备1

1.1 学习准备1

1.1.1 选择合适的浏览器1

1.1.2 选择合适的开发工具2

1.2 认识HTML52

1.2.1 HTML5语法2

1.2.2 新增与废除的元素和属性3

1.2.3 全局属性8

1.2.4 HTML5中新增的API11

1.3 本章小结11

第2章 HTML元素、属性与结构12

2.1 HTML元素12

2.1.1 HTML元素概述12

2.1.2 HTML元素的语法13

2.1.3 HTML元素的嵌套13

2.2 HTML5属性14

2.2.1 属性的基本使用方法14

2.2.2 HTML5全局属性15

2.3 新增的主体结构元素20

2.3.1 article元素20

2.3.2 section元素21

2.3.3 nav元素22

2.3.4 aside元素22

2.3.5 time元素24

2.4 新增的非主体结构元素25

2.4.1 header元素25

2.4.2 hgroup元素25

2.4.3 footer元素26

2.4.4 address元素26

2.5 HTML5结构27

2.5.1 文档结构大纲27

2.5.2 内容区块的编排方式27

2.5.3 标题分级28

2.6 本章小结28

第3章 JavaScript基础知识29

3.1 JavaScript简介29

3.1.1 什么是JavaScript29

3.1.2 JavaScript的特点29

3.1.3 JavaScript的组成30

3.1.4 JavaScript基本结构31

3.1.5 JavaScript执行原理31

3.2 在网页中引入JavaScript的方式31

3.2.1 使用〈script〉标签31

3.2.2 使用外部JavaScript文件32

3.2.3 直接在HTML标签中使用33

3.3 数据类型和变量33

3.3.1 变量33

3.3.2 Number33

3.3.3 字符串35

3.3.4 布尔值36

3.3.5 比较运算符36

3.3.6 数组36

3.3.7 对象37

3.4 条件判断38

3.4.1 if语句38

3.4.2 if…else语句38

3.4.3 if…else if…else语句39

3.4.4 switch语句39

3.5 循环语句40

3.5.1 for循环40

3.5.2 for…in循环41

3.5.3 while循环41

3.5.4 do…while循环42

3.6 函数定义和调用43

3.6.1 定义函数43

3.6.2 调用函数43

3.7 本章小结44

第4章 ES6基础知识45

4.1 准备测试环境45

4.2 声明变量let和const48

4.2.1 let命令48

4.2.2 块级作用域49

4.2.3 先声明后使用50

4.2.4 重复变量名50

4.2.5 实例：面试题51

4.3 模板字符串52

4.3.1 字符串格式化52

4.3.2 多行字符串52

4.3.3 运算与函数调用53

4.3.4 includes（）、startsWith（）和endsWith（）54

4.3.5 repeat（）55

4.4 箭头函数55

4.5 解构赋值56

4.5.1 对象解构赋值57

4.5.2 数组解构赋值57

4.5.3 字符串解构赋值58

4.6 Set和Map数据结构58

4.6.1 Set数据结构58

4.6.2 Set的基本操作59

4.6.3 扩展运算符61

4.6.4 Map数据结构62

4.6.5 Map遍历方法63

4.7 Promise对象64

4.7.1 Promise简介64

4.7.2 创建Promise对象65

4.7.3 then（）65

4.7.4 catch（）66

4.7.5 Promise.all（）66

4.7.6 Promise.race（）67

4.7.7 Promise.resolve（）67

4.7.8 Promise.reject（）68

4.8 for…of循环68

4.9 Generator函数69

4.10 async函数70

4.11 class71

4.12 实例：下馆子吃饭72

4.13 本章小结73

第5章 HTML5音频和视频74

5.1 Web视频的标准与格式74

5.2 video/audio元素概述75

5.3 检测浏览器是否支持HTML5视频75

5.4 实例：在HTML5中显示视频/音频77

5.5 video元素与audio元素详解78

5.5.1 video/audio属性78

5.5.2 video/audio方法79

5.5.3 video/audio事件81

5.6 本章小结83

第6章 HTML5 Canvas84

6.1 canvas基础入门84

6.1.1 什么是canvas84

6.1.2 实例：在HTML5页面中添加canvas元素84

6.1.3 实例：绘制一个蓝色矩形85

6.2 绘制基本线条86

6.2.1 实例：绘制直线87

6.2.2 实例：绘制二次曲线87

6.2.3 实例：绘制贝塞尔曲线89

6.2.4 实例：绘制圆弧89

6.3 绘制简单形状90

6.3.1 实例：绘制圆形90

6.3.2 实例：绘制三角形91

6.3.3 实例：绘制圆角矩形92

6.3.4 实例：绘制自定义图形94

6.4 绘制渐变95

6.4.1 实例：绘制线性渐变95

6.4.2 实例：绘制径向渐变96

6.5 图形组合97

6.5.1 实例：绘制阴影97

6.5.2 实例：透明效果99

6.6 使用图像100

6.6.1 实例：插入图像100

6.6.2 实例：平铺图像101

6.6.3 实例：裁剪图像102

6.6.4 实例：像素级操作103

6.7 绘制文字104

6.7.1 实例：控制文本的字体、大小和样式104

6.7.2 实例：控制文本的颜色106

6.7.3 实例：描绘文本的边缘107

6.7.4 实例：设置文本对齐方式108

6.8 图像数据与URL109

6.8.1 存储图像数据109

6.8.2 将彩色转为灰度110

6.8.3 图像数据URL111

6.8.4 将绘制的图形保存为图像文件111

6.9 用canvas实现动画效果112

6.9.1 实例：清除canvas的内容113

6.9.2 实例：创建动画113

6.9.3 动画的开始与停止115

6.10 实战演练115

6.11 本章小结120

第7章 HTML5 SVG121

7.1 SVG简介121

7.1.1 什么是SVG121

7.1.2 SVG有哪些优势121

7.2 HTML5中的SVG122

7.2.1 实例：将SVG直接嵌入HTML5页面122

7.2.2 实例：绘制简单的形状123

7.2.3 实例：复用内容124

7.2.4 实例：图形阴影125

7.2.5 实例：图形渐变126

7.2.6 实例：绘制自由路径127

7.3 画布与SVG的比较129

7.4 本章小结129

第8章 Forms API130

8.1 新增的Input输入类型130

8.1.1 email类型130

8.1.2 url类型131

8.1.3 number类型132

8.1.4 range类型132

8.1.5 date pickers类型133

8.1.6 search类型134

8.1.7 color类型134

8.2 新增的表单元素135

8.2.1 datalist元素135

8.2.2 keygen元素136

8.2.3 output元素137

8.3 新增的form属性137

8.3.1 autocomplete属性138

8.3.2 novalidate属性138

8.4 新增的input属性139

8.4.1 autocomplete属性139

8.4.2 autofocus属性139

8.4.3 form属性139

8.4.4 form overrides属性139

8.4.5 height和width属性140

8.4.6 list属性140

8.4.7 min、max和step属性140

8.4.8 multiple属性141

8.4.9 pattern属性141

8.4.10 placeholder属性141

8.4.11 required属性141

8.5 本章小结142

第9章 File API143

9.1 Blob对象143

9.2 File对象与Filelist对象144

9.3 FileReader对象145

9.3.1 FileReader对象的方法145

9.3.2 FileReader对象的事件146

9.3.3 实例：以二进制方式读取文件146

9.3.4 实例：以文本方式读取文件147

9.3.5 实例：以DataURL方式读取文件148

9.4 FileSystem对象149

9.4.1 FileSystem对象简介150

9.4.2 请求文件系统150

9.4.3 创建文件152

9.4.4 写入文件153

9.4.5 向文件中附加数据154

9.4.6 复制选中的文件155

9.4.7 删除文件155

9.4.8 创建目录156

9.4.9 读取目录内容156

9.4.10 删除目录157

9.4.11 复制文件或目录158

9.4.12 移动文件或目录159

9.4.13 fiilesystem：网址159

9.5 本章小结160

第10章 拖放API与桌面通知API161

10.1 拖放API（Drag and Drop API）161

10.1.1 实现拖放的步骤161

10.1.2 使用DataTransfer对象162

10.1.3 设置拖放时的视觉效果162

10.1.4 自定义拖放图标163

10.1.5 实例：选择图形163

10.2 桌面通知API（Notifiication API）166

10.2.1 桌面通知API的必要性166

10.2.2 桌面通知生成流程166

10.2.3 实例：桌面通知的两种实现方法166

10.3 本章小结168

第11章 本地存储与离线应用169

11.1 认识Web Storage169

11.1.1 客户端数据存储的历史与现状169

11.1.2 Web Storage概述170

11.1.3 示例：一个Web Storage的简单应用170

11.2 使用Web Storage172

11.2.1 检测浏览器的支持172

11.2.2 存入与读取数据173

11.2.3 清除数据174

11.2.4 遍历操作174

11.2.5 storage事件174

11.3 离线应用175

11.3.1 离线应用概述175

11.3.2 离线资源缓存175

11.3.3 Cache Mainfest基本用法176

11.3.4 分析Cache Mainfest文件177

11.3.5 在线状态监测177

11.3.6 实例：创建离线应用177

11.4 本章小结181

第12章 Communication API182

12.1 认识Communication API182

12.1.1 Communication API简介182

12.1.2 Communication API运行流程182

12.1.3 Communication API的基本用法183

12.2 跨文档消息通信详解183

12.2.1 源安全简介183

12.2.2 postMessage API基本用法184

12.2.3 实例：使用postMessage API创建应用184

12.3 XMLHttpRequest Level 2186

12.3.1 跨源XMLHttpRequest186

12.3.2 HTTP请求时限186

12.3.3 FormData对象187

12.3.4 上传文件187

12.3.5 接收二进制数据188

12.3.6 进度信息189

12.3.7 实例：创建XMLHttpRequest应用189

12.4 本章小结193

第13章 Web Workers API与Web SQL API194

13.1 Web Workers194

13.1.1 Web Workers简介194

13.1.2 实例：Web Workers简单应用195

13.1.3 Web Workers嵌套197

13.2 Web SQL199

13.2.1 Web SQL基本使用200

13.2.2 数据库的基本应用200

13.2.3 实例：创建数据库并创建数据表203

13.2.4 实例：插入数据与获取数据204

13.3 本章小结206

第14章 WebSocket API207

14.1 WebSocket概述207

14.2 WebSocket服务器208

14.3 使用WebSocket API208

14.3.1 浏览器支持情况检测209

14.3.2 WebSocket API客户端的基本用法209

14.4 实例：创建HTML5 WebSocket应用程序210

14.4.1 编写客户端HTML文件210

14.4.2 添加服务端WebSocket代码211

14.4.3 添加WebSocket客户端代码211

14.4.4 最终效果213

14.5 本章小结213

第15章 地理位置API214

15.1 地理位置的定位原理214

15.1.1 地理位置定位的方式及流程214

15.1.2 HTML5中如何实现地理位置定位214

15.2 Geolocation API215

15.2.1 检测浏览器的支持215

15.2.2 getCurrentPosition（）方法215

15.2.3 watchPosition（）方法218

15.2.4 clearPosition（）方法219

15.3 实例：在地图中显示地理位置219

15.4 本章小结221

第16章 History API222

16.1 History API概述222

16.2 为什么要用History API222

16.3 如何使用History API223

16.4 实例：浏览历史记录223

16.5 实例：添加与修改历史记录225

16.6 本章小结228

第17章 CSS基础知识229

17.1 CSS概述229

17.1.1 CSS简介229

17.1.2 CSS历史229

17.1.3 CSS特点230

17.1.4 CSS与浏览器的关系230

17.1.5 CSS站点欣赏230

17.2 基本CSS选择器231

17.2.1 标记选择器232

17.2.2 类别选择器232

17.2.3 ID选择器235

17.2.4 实例：应用基本选择器236

17.3 复合选择器238

17.3.1 “交集”选择器238

17.3.2 “并集”选择器239

17.3.3 后代选择器240

17.3.4 实例：应用复合选择器241

17.4 CSS继承特性242

17.4.1 什么是继承243

17.4.2 CSS属性继承243

17.4.3 实例：正确使用CSS继承特性243

17.5 CSS的层叠特性244

17.6 CSS样式245

17.6.1 行内样式245

17.6.2 内部样式246

17.6.3 外部样式246

17.6.4 实例：CSS样式的实现方式247

17.7 CSS优先级248

17.7.1 id优先级高于class248

17.7.2 后面的样式覆盖前面的样式249

17.7.3 使用！important250

17.7.4 指定的高于继承250

17.7.5 行内样式高于内部或外部样式251

17.7.6 实例：灵活运用CSS优先级252

17.8 CSS盒子模型254

17.8.1 盒子模型结构254

17.8.2 边框（border）255

17.8.3 内边距（padding）258

17.8.4 外边距（margin）259

17.8.5 盒子的浮动260

17.8.6 盒子的定位262

17.8.7 z-index空间位置264

17.8.8 盒子的display属性266

17.8.9 实例：用盒子模型创建网页布局267

17.9 本章小结270

第18章 CSS3选择器271

18.1 属性选择器271

18.1.1 E[att＝“val”]271

18.1.2 E[att＾＝“val”]272

18.1.3 E[att＄＝“val”]272

18.1.4 E[att＊＝“val”]272

18.1.5 实例：文本效果272

18.2 结构性伪类选择器273

18.2.1 伪类选择器274

18.2.2 伪元素选择器274

18.2.3 root选择器277

18.2.4 not选择器278

18.2.5 empty选择器279

18.2.6 target选择器279

18.2.7 fiirst-child选择器和last-child选择器280

18.2.8 fiirst-of-type选择器和last-of-type选择器282

18.2.9 nth-child选择器和nth-last-child选择器284

18.2.10 nth-of-type选择器和nth-last-of-type选择器286

18.2.11 循环使用样式287

18.2.12 only-child选择器和only-of-type选择器289

18.2.13 实例：定位指定元素289

18.3 UI元素状态伪类选择器291

18.3.1 E：hover、E：active和E：focus选择器291

18.3.2 E：enabled和E：disabled伪类选择器292

18.3.3 E：read-only和E：read-write伪类选择器293

18.3.4 E：checked、E：default和E：indeterminate伪类选择器294

18.3.5 E：：selection伪类选择器296

18.3.6 实例：用户界面新体验297

18.4 通用兄弟元素选择器E～F302

18.5 本章小结303

第19章 使用CSS选择器插入内容304

19.1 插入文字304

19.1.1 使用选择器插入文本304

19.1.2 插入筛选内容305

19.1.3 实例：CSS制作目录306

19.2 插入图像309

19.2.1 插入图像文件的方法309

19.2.2 插入图像文件的好处310

19.2.3 实例：列表图标与推荐标题310

19.3 插入项目编号311

19.3.1 插入连续项目编号311

19.3.2 在项目编号中追加文字312

19.3.3 设置编号种类313

19.3.4 插入嵌套编号314

19.3.5 在字符串两边添加嵌套文字编号315

19.3.6 实例：导航菜单316

19.4 本章小结321

第20章 使用CSS设置文本样式322

20.1 控制文本样式322

20.1.1 文本字体和大小322

20.1.2 文本颜色和粗细323

20.1.3 斜体文本323

20.1.4 文本装饰324

20.1.5 英文字母大小写转换324

20.1.6 实例：综合应用文本样式325

20.2 控制段落样式326

20.2.1 段落水平对齐326

20.2.2 段落垂直对齐327

20.2.3 行间距和字间距330

20.2.4 段落首字下沉330

20.2.5 实例：段落排版331

20.3 CSS3中为文本添加阴影——text-shadow属性332

20.3.1 text-shadow属性的使用方法332

20.3.2 位移距离333

20.3.3 阴影的模糊半径334

20.3.4 阴影的颜色334

20.3.5 指定多个阴影335

20.4 CSS3中让文本自动换行——text-break属性335

20.4.1 依靠浏览器让文本自动换行335

20.4.2 指定自动换行的处理方法336

20.5 本章小结338

第21章 使用CSS设置图片与背景样式339

21.1 图片样式339

21.1.1 图片边框设置339

21.1.2 设置图片位置341

21.1.3 设置图片缩放342

21.1.4 实例：图片边框按钮344

21.2 图片对齐345

21.2.1 水平对齐设置345

21.2.2 垂直对齐设置345

21.2.3 实例：排列的相册346

21.3 图文混排347

21.3.1 设置图文混排348

21.3.2 设置混排间距349

21.3.3 实例：看图说话350

21.4 背景颜色351

21.4.1 设置页面背景颜色351

21.4.2 设置块背景颜色352

21.5 背景图片352

21.5.1 设置页面背景图片352

21.5.2 重复的背景图片352

21.5.3 设置背景图片的位置353

21.5.4 设置背景滚动353

21.5.5 背景样式的缩写方式353

21.5.6 实例：创建背景皮肤354

21.6 本章小结355

第22章 使用CSS设置列表与表单样式356

22.1 列表控制356

22.1.1 列表的类型及使用356

22.1.2 创建垂直导航条357

22.1.3 创建水平导航条359

22.2 使用列表制作实用菜单359

22.2.1 实例：多级列表菜单359

22.2.2 实例：会伸缩的列表菜单363

22.3 表单设计概述366

22.3.1 表单的设计原则366

22.3.2 表单应用分类367

22.3.3 实例：经典表单效果369

22.4 表单的设计369

22.4.1 form标签369

22.4.2 表单元素370

22.4.3 对表单文本应用样式373

22.4.4 实例：滑块复选框374

22.4.5 实例：会员注册页面375

22.5 本章小结382

第23章 对超链接和鼠标应用样式383

23.1 使用CSS设置超链接383

23.1.1 什么是超链接383

23.1.2 关于超链接路径384

23.1.3 超链接属性控制384

23.1.4 图像映射385

23.1.5 实例：实现多页面跳转386

23.2 超链接特效387

23.2.1 实例：按钮式超链接387

23.2.2 实例：浮雕式超链接388

23.3 鼠标特效389

23.3.1 CSS控制鼠标箭头389

23.3.2 实例：鼠标变化的超链接390

23.4 本章小结391

第24章 CSS中的滤镜392

24.1 了解CSS滤镜392

24.1.1 Alpha滤镜392

24.1.2 Blur滤镜394

24.1.3 Grayscale滤镜395

24.1.4 Sepia滤镜396

24.1.5 Brightness滤镜397

24.1.6 Hue-rotate滤镜398

24.1.7 Invert滤镜399

24.1.8 Saturate滤镜400

24.1.9 Contrast滤镜401

24.1.10 Drop-shadow滤镜402

24.2 本章小结403

第25章 项目实战案例404

25.1 项目实战案例一：企业门户网站404

25.1.1 header元素中的内容406

25.1.2 aside元素中的内容409

25.1.3 section元素中的内容409

25.1.4 footer元素中的内容413

25.2 项目实战案例二：用户管理415