《从0到1：HTML+CSS+JavaScript快速上手》PPT课件,视频课

编辑推荐

源自阅读量破6000万的人气教程 适合零基础初学者，1小时快速上手，7天轻松入门 通俗易懂，风趣幽默，原来前端还能这么玩儿 每一节都配有微视频，每一章都配有大量练习 同步视频 配套练习 课件PPT 源码素材 作者答疑 如果你需要的不是大而全，而是恰到好处的前端开发教程，那么不妨试着看一下这本书。 本书源于作者在绿叶学习网分享的超人气在线教程。由于教程的风格独特、质量很高，因而累积获得超过十万读者的支持。为了更好地帮助零基础的小伙伴快速上手，每章后面都有习题，每一节都录制了配套的高质量视频，小伙伴们可直接扫码观看。 本书的配套资源包括：习题答案、源码文件、配套PPT教学课件，以及各种工具手册。

内容简介

作者根据自己多年的前后端开发经验，站在完全零基础读者的角度，详尽介绍了HTML、CSS和JavaScript的基础知识，以及大量的开发技巧。 全书分为三大部分：*部分是HTML基础，主要介绍各种标签的使用；第二部分是CSS基础，主要介绍样式布局操作；第三部分是JavaScript基础，主要介绍JavaScript语法基础的核心技术。对于书中每一章，作者还结合实际工作及前端面试，精心挑选了大量高质量的练习题，读者可以边学边练，以更好地掌握本书内容。 本书为每一节内容录制了高质量的视频课，并配备了所有案例的源码。此外，为了方便高校老师教学，本书还提供了配套的PPT课件。本书适合完全零基础的初学者使用，可以作为前端开发人员的参考书，也可以作为大中专院校相关专业的教学参考书。

作者简介

莫振杰，毕业于暨南大学信科院计算机科学与技术专业，从事前后端开发4年多，开发过绿叶学习网、广州智能工程研究会网站、大量在线应用工具及其他各种类型网站，著有多本编程书且销量过万， 现为绿叶学习网的站长，该网站用于分享其在前后端开发中的一些经验，其制作的前后端开发在线教程在互联网引起广泛关注，每一个教程都广受网友称赞与推崇，今年还开发了系列前端线上付费课程。

目录

• 第 一部分 HTML 基础
• 第 1 章 HTML 简介 3
• 1.1 前端技术简介 3
• 1.1.1 从“网页制作”到“前端开发” 3
• 1.1.2 从“前端开发”到“后端开发” 4
• 1.1.3 学习路线 6
• 1.2 什么是HTML 6
• 1.3 常见问题 7
• 第 2 章 开发工具 9
• 2.1 开发工具 9
• 2.2 使用HBuilder 10
• 第3 章 基本标签 13
• 3.1 HTML 结构 13
• 3.2 head 标签 15
• 3.2.1 title 标签 15
• 3.2.2 meta 标签 16
• 3.2.3 style 标签 18
• 3.2.4 script 标签 18
• 3.2.5 link 标签 19
• 3.2.6 base 标签 19
• 3.3 body 标签 19
• 3.4 HTML 注释 20
• 3.5 本章练习 21
• 第4 章 文本 22
• 4.1 文本简介 22
• 4.1.1 页面组成元素 22
• 4.1.2 HTML 文本 23
• 4.2 标题标签 24
• 4.3 段落标签 26
• 4.3.1 段落标签
• < p> 26
• 4.3.2 换行标签
• 27
• 4.4 文本标签 29
• 4.4.1 粗体标签 29
• 4.4.2 斜体标签 30
• 4.4.3 上标标签 31
• 4.4.4 下标标签 31
• 4.4.5 中划线标签 32
• 4.4.6 下划线标签 33
• 4.4.7 大字号标签和小字号标签 33
• 4.5 水平线标签 34
• 4.6 div 标签 35
• 4.7 自闭合标签 37
• 4.8 块元素和行内元素 38
• 4.8.1 块元素 38
• 4.8.2 行内元素 40
• 4.9 特殊符号 40
• 4.9.1 网页中的“空格” 40
• 4.9.2 网页中的“特殊符号” 42
• 4.10 本章练习 44
• 第5 章 列表 45
• 5.1 列表简介 45
• 5.2 有序列表 46
• 5.2.1 有序列表简介 46
• 5.2.2 type 属性 47
• 5.3 无序列表 48
• 5.3.1 无序列表简介 48
• 5.3.2 type 属性 49
• 5.3.3 深入无序列表 50
• 2 从 0 到 1 系列图书 目录
• 5.4 定义列表 53
• 5.5 HTML 语义化 54
• 5.6 本章练习 56
• 第6 章 表格 57
• 6.1 表格简介 57
• 6.2 基本结构 57
• 6.3 完整结构 59
• 6.3.1 表格标题：caption 59
• 6.3.2 表头单元格：th 60
• 6.4 语义化 62
• 6.5 合并行：rowspan 65
• 6.6 合并列：colspan 66
• 6.7 本章练习 67
• 第7 章 图片 68
• 7.1 图片标签 68
• 7.1.1 src 属性 68
• 7.1.2 alt 属性和title 属性 69
• 7.2 图片路径 71
• 7.2.1 page1.html 引用图片 72
• 7.2.2 page2.html 引用图片 73
• 7.3 图片格式 75
• 7.3.1 位图 75
• 7.3.2 矢量图 76
• 7.4 本章练习 78
• 第8 章 超链接 79
• 8.1 超链接简介 79
• 8.1.1 a 标签 79
• 8.1.2 target 属性 81
• 8.2 内部链接 82
• 8.3 锚点链接 83
• 8.4 本章练习 86
• 第9 章 表单 87
• 9.1 表单简介 87
• 9.1.1 表单是什么 87
• 9.1.2 表单标签 88
• 9.2 form 标签 89
• 9.2.1 form 标签简介 89
• 9.2.2 form 标签属性 90
• 9.3 input 标签 91
• 9.4 单行文本框 92
• 9.4.1 单行文本框简介 92
• 9.4.2 单行文本框属性 92
• 9.5 密码文本框 94
• 9.5.1 密码文本框简介 94
• 9.5.2 密码文本框属性 96
• 9.6 单选框 97
• 9.6.1 单选框简介 97
• 9.6.2 忽略点 98
• 9.7 复选框 101
• 9.8 按钮 103
• 9.8.1 普通按钮button 103
• 9.8.2 提交按钮submit 104
• 9.8.3 重置按钮reset 105
• 9.8.4 button 标签 107
• 9.9 文件上传 107
• 9.10 多行文本框 108
• 9.11 下拉列表 109
• 9.11.1 下拉列表简介 109
• 9.11.2 select 标签属性 110
• 9.11.3 option 标签属性 112
• 9.12 本章练习 114
• 第 10 章 框架 116
• 10.1 iframe 标签 116
• 10.2 练习题 117
• 从0 到1 系列图书 目录 3
• 第 11 章 CSS 简介 121
• 11.1 CSS 简介 121
• 11.1.1 CSS 是什么 121
• 11.1.2 CSS 和CSS3 121
• 11.2 CSS 引入方式 122
• 11.2.1 外部样式表 122
• 11.2.2 内部样式表 123
• 11.2.3 行内样式表 124
• 11.3 本章练习 125
• 第 12 章 CSS 选择器 126
• 12.1 元素的id 和class 126
• 12.1.1 id 属性 126
• 12.1.2 class 属性 127
• 12.2 选择器是什么 127
• 12.3 CSS 选择器 129
• 12.3.1 元素选择器 129
• 12.3.2 id 选择器 130
• 12.3.3 class 选择器 132
• 12.3.4 后代选择器 134
• 12.3.5 群组选择器 135
• 12.4 本章练习 138
• 第 13 章 字体样式 139
• 13.1 字体样式简介 139
• 13.2 字体类型：font-family 140
• 13.3 字体大小：font-size 141
• 13.3.1 px 是什么 142
• 13.3.2 采用px 为单位 142
• 13.4 字体粗细：font-weight 143
• 13.5 字体风格：font-style 145
• 13.6 字体颜色：color 146
• 13.6.1 关键字 146
• 13.6.2 十六进制RGB 值 147
• 13.7 CSS 注释 148
• 13.8 本章练习 150
• 第 14 章 文本样式 152
• 14.1 文本样式简介 152
• 14.2 首行缩进：text-indent 152
• 14.3 水平对齐：text-align 154
• 14.4 文本修饰：text-decoration 155
• 14.4.1 text-decoration 属性 155
• 14.4.2 3 种划线的用途分析 157
• 14.5 大小写：text-transform 157
• 14.6 行高：line-height 158
• 14.7 间距：letter-spacing、
• word-spacing 160
• 14.7.1 字间距 160
• 14.7.2 词间距 161
• 14.8 本章练习 162
• 第 15 章 边框样式 163
• 15.1 边框样式简介 163
• 15.2 整体样式 164
• 15.2.1 边框的属性 164
• 15.2.2 简写形式 166
• 15.3 局部样式 167
• 15.4 本章练习 170
• 第 16 章 列表样式 171
• 16.1 列表项符号：list-style-type 171
• 16.1.1 定义列表项符号 171
• 16.1.2 去除列表项符号 173
• 16.2 列表项图片：list-style-image 174
• 16.3 本章练习 176
• 第二部分 CSS 基础
• 4 从 0 到 1 系列图书 目录
• 第 17 章 表格样式 177
• 17.1 表格标题位置：caption-side 177
• 17.2 表格边框合并：border-collapse 179
• 17.3 表格边框间距：border-spacing 180
• 17.4 本章练习 182
• 第 18 章 图片样式 183
• 18.1 图片大小 183
• 18.2 图片边框 184
• 18.3 图片对齐 185
• 18.3.1 水平对齐 185
• 18.3.2 垂直对齐 187
• 18.4 文字环绕：float 189
• 18.5 本章练习 191
• 第 19 章 背景样式 192
• 19.1 背景样式简介 192
• 19.2 背景颜色：background-color 192
• 19.3 背景图片样式：background-
• image 194
• 19.4 背景图片重复：background-
• repeat 196
• 19.5 背景图片位置：background-
• position 198
• 19.5.1 像素值 198
• 19.5.2 关键字 199
• 19.6 背景图片固定：background-
• attachment 201
• 19.7 本章练习 202
• 第 20 章 超链接样式 203
• 20.1 超链接伪类 203
• 20.1.1 超链接伪类简介 203
• 20.1.2 深入了解超链接伪类 205
• 20.2 深入了解:hover 206
• 20.3 鼠标样式 208
• 20.3.1 浏览器鼠标样式 208
• 20.3.2 自定义鼠标样式 209
• 20.4 本章练习 210
• 第 21 章 盒子模型 212
• 21.1 CSS 盒子模型 212
• 21.2 宽高：width、height 215
• 21.3 边框：border 218
• 21.4 内边距：padding 219
• 21.4.1 padding 局部样式 219
• 21.4.2 padding 简写形式 220
• 21.5 外边距：margin 222
• 21.5.1 margin 局部样式 222
• 21.5.2 margin 简写形式 226
• 21.5.3 浏览器审查元素 227
• 21.6 本章练习 228
• 第 22 章 浮动布局 230
• 22.1 文档流简介 230
• 22.1.1 正常文档流 230
• 22.1.2 脱离文档流 231
• 22.2 浮动 233
• 22.3 清除浮动 236
• 22.4 本章练习 238
• 第 23 章 定位布局 240
• 23.1 定位布局简介 240
• 23.2 固定定位：fixed 240
• 23.3 相对定位：relative 243
• 23.4 绝对定位：absolute 245
• 23.5 静态定位：static 247
• 23.6 本章练习 247
• 从0 到1 系列图书 目录 5
• 第 24 章 JavaScript 简介 251
• 24.1 JavaScript 是什么 251
• 24.1.1 JavaScript 简介 251
• 24.1.2 教程介绍 252
• 24.2 JavaScript 开发工具 253
• 24.3 JavaScript 引入方式 255
• 24.3.1 外部JavaScript 255
• 24.3.2 内部JavaScript 256
• 24.3.3 元素属性JavaScript 258
• 24.4 一个简单的JavaScript 程序 259
• 24.5 本章练习 261
• 第 25 章 语法基础 262
• 25.1 语法简介 262
• 25.2 变量与常量 263
• 25.2.1 变量 263
• 25.2.2 常量 268
• 25.3 数据类型 268
• 25.3.1 数字 269
• 25.3.2 字符串 269
• 25.3.3 布尔值 272
• 25.3.4 未定义值 273
• 25.3.5 空值 274
• 25.4 运算符 274
• 25.4.1 算术运算符 275
• 25.4.2 赋值运算符 279
• 25.4.3 比较运算符 281
• 25.4.4 逻辑运算符 282
• 25.4.5 条件运算符 285
• 25.5 表达式与语句 286
• 25.6 类型转换 287
• 25.6.1 “字符串”转换为“数字” 287
• 25.6.2 “数字”转换为“字符串” 291
• 25.7 转义字符 293
• 25.8 注释 295
• 25.8.1 单行注释 295
• 25.8.2 多行注释 296
• 25.9 本章练习 297
• 第 26 章 流程控制 299
• 26.1 流程控制简介 299
• 26.1.1 顺序结构 299
• 26.1.2 选择结构 300
• 26.1.3 循环结构 301
• 26.2 选择结构：if 301
• 26.2.1 单向选择：if... 302
• 26.2.2 双向选择：if...else... 303
• 26.2.3 多向选择：if...else if...else... 305
• 26.2.4 if 语句的嵌套 306
• 26.3 选择结构：switch 309
• 26.4 循环结构：while 313
• 26.5 循环结构：do...while 317
• 26.6 循环结构：for 318
• 26.7 实战题：判断一个数是整数，还是
• 小数 321
• 26.8 实战题：找出“水仙花数” 322
• 26.9 本章练习 323
• 第 27 章 初识函数 325
• 27.1 函数是什么 325
• 27.2 函数的定义 327
• 27.2.1 没有返回值的函数 327
• 27.2.2 有返回值的函数 330
• 27.2.3 全局变量与局部变量 331
• 27.3 函数的调用 333
• 第三部分 JavaScript 基础
• 6 从 0 到 1 系列图书 目录
• 27.3.1 直接调用 334
• 27.3.2 在表达式中调用 335
• 27.3.3 在超链接中调用 336
• 27.3.4 在事件中调用 337
• 27.4 嵌套函数 338
• 27.5 内置函数 339
• 27.6 实战题：判断某一年是否是闰年 340
• 27.7 实战题：求出任意5 个数的最大值 341
• 27.8 本章练习 342
• 第 28 章 字符串对象 344
• 28.1 内置对象简介 344
• 28.2 获取字符串长度 344
• 28.3 大小写转换 346
• 28.4 获取某一个字符 347
• 28.5 截取字符串 349
• 28.6 替换字符串 351
• 28.7 分割字符串 353
• 28.8 检索字符串的位置 357
• 28.9 实战题：统计某一个字符的个数 359
• 28.10 实战题：统计字符串中有多少个
• 数字 360
• 28.11 本章练习 361
• 第 29 章 数组对象 362
• 29.1 数组是什么 362
• 29.2 数组的创建 363
• 29.3 数组的获取 363
• 29.4 数组的赋值 364
• 29.5 获取数组长度 366
• 29.6 截取数组某部分 369
• 29.7 添加数组元素 371
• 29.7.1 在数组开头添加元素：unshift() 371
• 29.7.2 在数组结尾添加元素：push() 372
• 29.8 删除数组元素 374
• 29.8.1 删除数组中第 一个元素：shift() 374
• 29.8.2 删除数组最后一个元素：pop() 375
• 29.9 比较数组大小 377
• 29.10 颠倒数组顺序 378
• 29.11 将数组元素连接成字符串 379
• 29.12 实战题：数组与字符串的转换
• 操作 381
• 29.13 实战题：计算面积与体积，返回一个
• 数组 382
• 29.14 本章练习 383
• 第30 章 时间对象 385
• 30.1 时间对象简介 385
• 30.2 操作年、月、日 387
• 30.2.1 获取年、月、日 387
• 30.2.2 设置年、月、日 389
• 30.3 操作时、分、秒 391
• 30.3.1 获取时、分、秒 391
• 30.3.2 设置时、分、秒 392
• 30.4 获取星期几 393
• 30.5 本章练习 395
• 第31 章 数学对象 396
• 31.1 数学对象简介 396
• 31.2 Math 对象的属性 396
• 31.3 Math 对象的方法 398
• 31.4 最大值与最小值 398
• 31.5 取整运算 399
• 31.5.1 向下取整：floor() 399
• 31.5.2 向上取整：ceil() 401
• 31.6 三角函数 402
• 31.7 生成随机数 403
• 31.7.1 随机生成某个范围内的“任意数” 404
• 31.7.2 随机生成某个范围内的“整数” 404
• 31.8 实战题：生成随机验证码 405
• 从0 到1 系列图书 目录 7
• 31.9 实战题：生成随机颜色值 406
• 31.10 本章练习 407
• 第32 章 DOM 基础 408
• 32.1 核心技术简介 408
• 32.2 DOM 是什么 408
• 32.2.1 DOM 对象 408
• 32.2.2 DOM 结构 409
• 32.3 节点类型 410
• 32.4 获取元素 411
• 32.4.1 getElementById() 411
• 32.4.2 getElementsByTagName() 413
• 32.4.3 getElementsByClassName() 418
• 32.4.4 querySelector() 和
• querySelectorAll() 419
• 32.4.5 getElementsByName() 422
• 32.4.6 document.title 和
• document.body 424
• 32.5 创建元素 424
• 32.6 插入元素 430
• 32.6.1 appendChild() 430
• 32.6.2 insertBefore() 432
• 32.7 删除元素 434
• 32.8 复制元素 436
• 32.9 替换元素 438
• 32.10 本章练习 439
• 第33 章 DOM 进阶 441
• 33.1 HTML 属性操作（对象属性） 441
• 33.1.1 获取HTML 属性值 441
• 33.1.2 设置HTML 属性值 448
• 33.2 HTML 属性操作（对象方法） 450
• 33.2.1 getAttribute() 450
• 33.2.2 setAttribute() 453
• 33.2.3 removeAttribute() 454
• 33.2.4 hasAttribute() 456
• 33.3 CSS 属性操作 458
• 33.3.1 获取CSS 属性值 458
• 33.3.2 设置CSS 属性值 459
• 33.3.3 最后一个问题 466
• 33.4 DOM 遍历 469
• 33.4.1 查找父元素 469
• 33.4.2 查找子元素 471
• 33.4.3 查找兄弟元素 475
• 33.5 innerHTML 和innerText 477
• 33.6 本章练习 480
• 第34 章 事件基础 482
• 34.1 事件是什么 482
• 34.2 事件调用方式 483
• 34.2.1 在script 标签中调用 483
• 34.2.2 在元素中调用事件 484
• 34.3 鼠标事件 486
• 34.3.1 鼠标单击 486
• 34.3.2 鼠标移入和鼠标移出 488
• 34.3.3 鼠标按下和鼠标松开 490
• 34.4 键盘事件 491
• 34.5 表单事件 493
• 34.5.1 onfocus 和onblur 493
• 34.5.2 onselect 496
• 34.5.3 onchange 498
• 34.6 编辑事件 501
• 34.6.1 oncopy 501
• 34.6.2 onselectstart 502
• 34.6.3 oncontextmenu 503
• 34.7 页面事件 504
• 34.7.1 onload1 504
• 34.7.2 onbeforeunload 507
• 34.8 本章练习 508
• 8 从 0 到 1 系列图书 目录
• 第35 章 事件进阶 509
• 35.1 事件监听器 509
• 35.1.1 事件处理器 509
• 35.1.2 事件监听器 510
• 35.2 event 对象 518
• 35.2.1 type 519
• 35.2.2 keyCode 520
• 35.3 this 522
• 35.4 本章练习 526
• 第36 章 window 对象 527
• 36.1 window 对象简介 527
• 36.2 窗口操作 528
• 36.2.1 打开窗口 529
• 36.2.2 关闭窗口 534
• 36.3 对话框 536
• 36.3.1 alert() 536
• 36.3.2 confirm() 537
• 36.3.3 prompt() 538
• 36.4 定时器 540
• 36.4.1 setTimeout() 和
• clearTimeout() 541
• 36.4.2 setInterval() 和clearInterval() 545
• 36.5 location 对象 549
• 36.5.1 window.location.href 550
• 36.5.2 window.location.search 551
• 36.5.3 window.location.hash 552
• 36.6 navigator 对象 553
• 36.7 本章练习 556
• 第37 章 document 对象 557
• 37.1 document 对象简介 557
• 37.2 document 对象属性 557
• 37.2.1 document.URL 558
• 37.2.2 document.referrer 559
• 37.3 document 对象方法 559
• 37.3.1 document.write() 560
• 37.3.2 document.writeln() 561
• 37.4 本章练习 563
• 附录A HTML 常用标签 564
• 附录B CSS 常用属性 566
• 附录C JavaScript 常用方法 568
• 附录D 常用的随机数 570