Web前端学习笔记 HTML5+CSS3+JavaScriptPDF|Epub|txt|kindle电子书版本网盘下载

Web前端学习笔记 HTML5+CSS3+JavaScriptPDF格式电子书版下载

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

第1篇 HTML51

第1章 HTML5学习概述1

1.1 认识HTML51

1.1.1 HTML的发展历程1

1.1.2 HTML5与HTML4的区别2

1.2 学习HTML5前的准备工作2

1.2.1 常用浏览器介绍2

1.2.2 常见的HTML5开发软件介绍3

1.2.3 创建第一个HTML5页面4

1.3 HTML5的语法与结构5

1.3.1 HTML5的语法5

1.3.2 HTML5的文档结构6

1.4 章节案例：开始我的第一个网页8

第2章 HTML5常见的块级标签和行级标签10

2.1 常见的块级标签10

2.1.1 ＜h1＞＜/h1＞…＜h6＞＜/h6＞：标题标签10

2.1.2 ＜hr/＞：水平线标签11

2.1.3 ＜p＞＜/P＞：段落标签12

2.1.4 ＜br/＞：换行标签12

2.1.5 ＜blockquote＞＜/blockquote＞：引用标签13

2.1.6 ＜pre＞＜/pre＞：预格式标签13

2.1.7 ＜ul＞＜li＞＜/li＞＜/ul＞：无序列表标签14

2.1.8 ＜ol＞＜li＞＜/li＞＜/ol＞：有序列表标签15

2.1.9 ＜dl＞＜/dl＞：定义列表标签17

2.1.10 ＜div＞＜/div＞：分区标签18

2.2 常见的行级标签19

2.2.1 ＜img/＞：图片标签19

2.2.2 ＜a＞＜/a＞：超链接标签20

2.2.3 其他常用的行级标签21

2.3 HTML5新增标签简介22

2.4 章节案例：促销信息网页实现23

第3章 HTML5表格25

3.1 HTML5表格简介25

3.1.1 表格的基本结构26

3.1.2 表格的定义26

3.2 表格的基本属性27

3.2.1 border：表格边框属性27

3.2.2 width/height：表格（宽度/高度）属性28

3.2.3 bgcolor：表格背景色属性28

3.2.4 background：表格背景图属性28

3.2.5 bordercolor：表格边框颜色属性29

3.2.6 cellspacing：表格单元格间距属性29

3.2.7 cellpadding：表格单元格内边距属性30

3.2.8 align：表格对齐属性31

3.3 行和列的属性31

3.3.1 width/height：单元格宽度……高度属性32

3.3.2 bgcolor：单元格背景色属性32

3.3.3 align：单元格内容水平对齐属性33

3.3.4 valign：单元格内容垂直对齐属性33

3.3.5 colspan/rowspan：表格的跨行与跨列34

3.4 表格的结构化与直列化35

3.4.1 表格的结构化35

3.4.2 表格的直列化36

3.5 章节案例：完成“特别休假申请单”37

第4章 HTML5表单40

4.1 表单简介40

4.1.1 表单的结构40

4.1.2 表单的常用属性41

4.2 input输入框42

4.2.1 input常用属性42

4.2.2 text：文本输入框43

4.2.3 password：密码输入框44

4.2.4 radio：单选按钮44

4.2.5 checkbox：复选按钮44

4.2.6 file：文件上传按钮45

4.2.7 submit：表单提交按钮46

4.2.8 reset：重置按钮46

4.2.9 image：图形提交按钮47

4.2.10 button：可单击按钮47

4.3 其他表单元素47

4.3.1 select下拉选择控件47

4.3.2 textarea文本域50

4.3.3 button按钮50

4.4 HTML5智能表单51

4.4.1 表单分组51

4.4.2 表单新增元素及属性52

4.5 章节案例：用户注册页面实现57

第2篇 CSS360

第5章 CSS基础知识60

5.1 CSS概述60

5.1.1 CSS简介60

5.1.2 CSS语法结构61

5.1.3 CSS注释61

5.1.4 行内样式表62

5.1.5 内部样式表62

5.1.6 外部样式表62

5.2 CSS选择器64

5.2.1 通用选择器64

5.2.2 标签选择器64

5.2.3 类选择器64

5.2.4 id选择器65

5.2.5 后代选择器与子代选择器66

5.2.6 交集选择器与并集选择器66

5.2.7 伪类选择器67

5.2.8 选择器的命名规则及优先级67

5.3 章节案例：CSS选择器练习68

第6章 CSS常用属性70

6.1 CSS常用文本属性70

6.1.1 字体、字号与颜色属性70

6.1.2 文本属性72

6.2 CSS常用背景属性76

6.2.1 背景颜色属性76

6.2.2 背景图像属性76

6.3 CSS其他常用属性79

6.3.1 列表常用属性79

6.3.2 超链接样式属性79

6.4 章节案例：实现素材图片效果80

第7章 CSS3新增属性与选择器82

7.1 CSS3的过渡与变换82

7.1.1 transition：过渡属性82

7.1.2 transform：变换属性84

7.2 CSS3动画86

7.2.1 CSS3动画的＠keyframes和animation86

7.2.2 CSS3 animation动画属性88

7.3 CSS3其他常用属性90

7.3.1 CSS3渐变效果90

7.3.2 CSS3多列属性92

7.4 CSS3新增选择器93

7.4.1 属性选择器93

7.4.2 结构伪类选择器95

7.4.3 状态伪类选择器96

7.4.4 其他选择器97

7.5 章节案例：飞机滑翔动画实现98

第8章 CSS盒模型与浮动定位101

8.1 盒模型101

8.1.1 盒模型概述101

8.1.2 margin：外边距104

8.1.3 border：边框107

8.1.4 padding：内边距109

8.2 盒模型相关属性110

8.2.1 overflow：内容溢出控制110

8.2.2 outline：外围线112

8.2.3 box-shadow：盒子阴影113

8.2.4 border-radius：边框圆角113

8.2.5 border-image：图片边框115

8.3 浮动与清除浮动116

8.3.1 float：浮动116

8.3.2 clear：清除浮动117

8.3.3 子盒子浮动造成父盒子高度塌陷118

8.4 定位120

8.4.1 relative：相对定位120

8.4.2 absolute：绝对定位121

8.4.3 fixed：固定定位123

8.4.4 使用定位实现元素的绝对居中124

8.4.5 z-index126

8.5 章节案例：网页布局练习127

第9章 移动开发与响应式131

9.1 移动开发基础知识131

9.1.1 媒体设备常用属性131

9.1.2 像素的基础知识132

9.1.3 viewport：视口132

9.2 移动开发常用设置134

9.2.1 移动开发中常用的头部标签134

9.2.2 移动开发中常用的CSS设置135

9.3 网页布局方式介绍136

9.3.1 网页的布局方式136

9.3.2 响应式布局介绍137

9.4 媒体查询实现响应式138

9.4.1 媒体查询的基本语法138

9.4.2 使用媒体查询的三种方式139

9.5 章节案例：媒体查询实例练习139

第10章 CSS3弹性布局143

10.1 弹性布局简介143

10.1.1 弹性布局的基本概念143

10.1.2 使用弹性布局需要注意的问题143

10.1.3 弹性布局代码示例144

10.2 作用于容器的属性145

10.2.1 flex-direction：主轴方向145

10.2.2 flex-wrap：控制换行146

10.2.3 flex-flow：缩写形式146

10.2.4 justify-content：主轴对齐146

10.2.5 align-items：交叉轴单行对齐147

10.2.6 align-content：交叉轴多行对齐147

10.3 作用于项目的属性148

10.3.1 order：项目排序148

10.3.2 flex-grow：项目放大比149

10.3.3 flex-shrink：项目缩小比149

10.3.4 flex-basis：伸缩基准值149

10.3.5 flex：缩写形式150

10.3.6 align-self：自身对齐150

第3篇 JavaScript151

第11章 JavaScript基础151

11.1 JavaScript简介151

11.1.1 JavaScript概念151

11.1.2 页面中使用JavaScript的三种方式152

11.2 JavaScript的变量152

11.2.1 变量的声明152

11.2.2 声明变量的注意事项与命名规范153

11.2.3 变量的数据类型154

11.3 JavaScript中的变量函数156

11.3.1 Number：将变量转为数值类型156

11.3.2 isNaN：检测变量是否为NaN157

11.3.3 parseInt：将字符串转为整型157

11.3.4 parseFloat：将字符串转为浮点型158

11.3.5 typeof：变量类型检测158

11.4 JavaScript中的输入输出159

11.4.1 document.write：文档中打印输出159

11.4.2 alert：浏览器弹窗输出159

11.4.3 prompt：浏览器弹窗输入160

11.4.4 confirm：浏览器弹窗确认160

11.4.5 console.log：浏览器控制台输出161

11.4.6 JavaScript中的注释162

11.5 JavaScript的运算符163

11.5.1 算术运算163

11.5.2 赋值运算符164

11.5.3 关系运算与逻辑运算165

11.5.4 条件运算（多目运算）166

11.5.5 逗号运算符167

11.5.6 运算符的优先级167

11.6 章节案例：判断一个数是否为水仙花数168

第12章 JavaScript流程控制语句170

12.1 分支结构170

12.1.1 简单if结构170

12.1.2 if-else结构171

12.1.3 多重if结构172

12.1.4 嵌套if结构172

12.1.5 switch-case结构173

12.2 循环结构175

12.2.1 循环的基本思路175

12.2.2 while循环结构176

12.2.3 do-while循环结构177

12.2.4 for循环结构177

12.2.5 循环嵌套178

12.3 流程控制语句180

12.3.1 break语句180

12.3.2 continue语句180

12.3.3 return语句181

12.4 章节案例：打印输出一个菱形182

第13章 JavaScript函数184

13.1 函数的声明与调用184

13.1.1 函数的声明184

13.1.2 函数的调用185

13.1.3 函数的作用域186

13.1.4 函数声明和调用的注意事项187

13.2 匿名函数的声明与调用188

13.2.1 事件调用匿名函数188

13.2.2 匿名函数表达式188

13.2.3 自执行函数189

13.3 函数中的内置对象190

13.3.1 arguments对象190

13.3.2 this关键字192

13.4 JavaScript中代码的执行顺序193

13.5 章节案例：编写函数统计任意区间内的质数194

第14章 BOM与DOM196

14.1 window对象196

14.1.1 window对象的属性196

14.1.2 window对象的常用方法197

14.2 浏览器对象模型的其他对象199

14.2.1 screen：屏幕对象199

14.2.2 location：地址栏对象200

14.2.3 history：历史记录对象201

14.2.4 navigator：浏览器配置对象202

14.3 Core DOM203

14.3.1 DOM树结构分析204

14.3.2 操作元素节点204

14.3.3 操作文本节点205

14.3.4 操作属性节点208

14.3.5 JavaScript修改元素样式209

14.3.6 获取层次节点212

14.3.7 创建新节点214

14.3.8 删除/替换节点217

14.4 HTML DOM218

14.4.1 HTML DOM操作表格对象219

14.4.2 HTML DOM操作行对象220

14.4.3 HTML DOM操作单元格对象222

14.5 章节案例：实现评论提交展示功能223

第15章 JavaScript事件228

15.1 JavaScript的事件228

15.1.1 鼠标事件228

15.1.2 键盘事件229

15.1.3 HTML事件231

15.1.4 event事件因子233

15.2 JavaScript的事件模型234

15.2.1 DOM0事件模型234

15.2.2 DOM2事件模型234

15.3 JavaScript的事件流模型236

15.3.1 事件冒泡236

15.3.2 事件捕获238

15.3.3 事件委派240

15.3.4 阻止事件冒泡242

15.3.5 阻止默认事件242

15.4 章节案例：对表格进行修改删除操作243

第16章 数组和对象246

16.1 JavaScript的数组246

16.1.1 数组的概念246

16.1.2 数组的声明246

16.1.3 数组的访问248

16.1.4 数组常用方法248

16.1.5 二维数组和稀疏数组255

16.2 JavaScript的内置对象256

16.2.1 Boolean：逻辑对象256

16.2.2 Number：数字对象256

16.2.3 String：字符串对象258

16.2.4 Date：日期对象260

16.2.5 Math：算术对象261

16.3 JavaScript自定义对象262

16.3.1 对象的概念262

16.3.2 对象的声明263

16.3.3 对象的属性与方法264

16.4 章节案例：编写对象实现班级成绩录入265

第17章 JavaScript中的正则表达式268

17.1 正则表达式基础268

17.1.1 正则表达式概述268

17.1.2 正则表达式的声明269

17.2 正则表达式的常用字符269

17.2.1 正则表达式中的元字符269

17.2.2 正则表达式中的特殊字符270

17.3 正则表达式的常用模式271

17.3.1 g：全局匹配272

17.3.2 i：忽略大小写匹配272

17.3.3 m：多行匹配273

17.4 正则表达式的常用方法274

17.4.1 test()方法274

17.4.2 exec()方法274

17.5 章节案例：使用正则表达式验证用户注册表单276

第18章 JavaScript面向对象编程278

18.1 面向对象编程基础278

18.1.1 面向对象概述278

18.1.2 类与对象279

18.1.3 类和对象的关系279

18.1.4 JavaScript创建类与对象的步骤279

18.1.5 constructor与instanceof281

18.1.6 for-in：对象的遍历281

18.2 成员属性、静态属性与私有属性282

18.2.1 成员属性与成员方法282

18.2.2 静态属性与静态方法282

18.2.3 私有属性与私有方法283

18.3 this关键字284

18.3.1 this的指向概述284

18.3.2 this指向的规律284

18.3.3 this指向练习285

18.4 原型与原型链286

18.4.1 ＿proto＿与prototype286

18.4.2 原型链287

18.4.3 原型属性与原型方法287

18.5 封装289

18.5.1 封装的基本概念289

18.5.2 JavaScript模拟实现封装290

18.6 继承291

18.6.1 继承的基本概念291

18.6.2 扩展Object的prototype实现继承291

18.6.3 使用原型继承293

18.6.4 使用call和apply实现继承294

18.7 JavaScript中的闭包295

18.7.1 闭包的基本概念296

18.7.2 闭包的作用296

18.7.3 闭包应用实例297

18.8 章节案例：定义一个URL信息操作类298