HTML+CSS+JavaScript网页设计实战 视频教学版PDF电子书下载

第1篇 HTML础知知识 4

第1章 HTML入门知识 4

1.1 网页与网站 4

1.1.1 什么是网页与网站 4

1.1.2 网页基本构成元素 5

1.2 HTML的基本概念 6

1.2.1 什么是HTML 6

1.2.2 HTML的发展历程 6

1.2.3 HTML页面的整体结构 7

1.3 使用浏览器查看源文件 8

1.4 大神解惑 9

1.5 跟我练练手 9

第2章 网页文档结构 12

2.1 HTML文件基本结构 12

2.2 HTML5基本标记详解 12

2.2.1 文档类型说明 12

2.2.2 HTML标记 13

2.2.3 头标记 13

2.2.4 网页的主体标记body 15

2.2.5 页面注释标记 16

2.3 HTML5语法的变化 16

2.3.1 标记不再区分大小写 17

2.3.2 允许属性值不使用引号 17

2.3.3 允许部分属性值的属性省略 17

2.4 网页文件的编写方法 18

2.4.1 使用记事本手工编写网页 18

2.4.2 使用Dreamweaver CC编写HTML文件 19

2.5 符合W3C标准的HTML5网页 20

2.6 大神解惑 21

2.7 跟我练练手 22

第3章 网页中的文本和图像 24

3.1 在网页中添加文本 24

3.1.1 普通文本的添加 24

3.1.2 特殊字符文本的添加 24

3.1.3 特殊文本的添加 26

3.2 文本排版 27

3.2.1 换行标记 27

3.2.2 段落标记 28

3.2.3 标题标记 28

3.3 文字列表 29

3.3.1 建立无序列表 29

3.3.2 建立有序列表 30

3.3.3 建立不同类型的无序列表 30

3.3.4 建立不同类型的有序列表 31

3.3.5 建立嵌套列表 31

3.3.6 自定义列表 32

3.4 网页中的图像 32

3.4.1 插入图像 32

3.4.2 设置图像的宽度和高度 34

3.4.3 设置图像的提示文字 35

3.4.4 将图片设置为网页背景 36

3.4.5 排列图像 36

3.5 图文并茂房屋装饰装修网页 37

3.6 在线购物网站产品展示效果 38

3.7 大神解惑 39

3.8 跟我练练手 40

第4章 建立超链接 42

4.1 网页超链接的概念 42

4.1.1 什么是网页超链接 42

4.1.2 超链接中的URL 42

4.1.3 超链接的URL类型 43

4.2 建立网页超链接 43

4.2.1 创建超文本链接 43

4.2.2 创建图片链接 44

4.2.3 创建下载链接 46

4.2.4 使用相对路径和绝对路径 46

4.2.5 设置以新窗口显示超链接页面 47

4.2.6 设置电子邮件链接 48

4.3 浮动框架 49

4.4 精确定位热点区域 50

4.5 使用锚链接制作电子书阅读网页 54

4.6 大神解惑 56

4.7 跟我练练手 56

第5章 创建表格和表单 58

5.1 表格的基本结构 58

5.2 创建表格 59

5.2.1 创建普通表格 59

5.2.2 创建带有标题的表格 60

5.2.3 定义表格的边框类型 60

5.2.4 定义表格的表头 61

5.2.5 设置表格背景 61

5.2.6 设置单元格背景 62

5.2.7 合并单元格 63

5.2.8 排列单元格中的内容 66

5.2.9 设置表格的行高与列宽 66

5.3 创建完整的表格 67

5.4 认识表单 68

5.5 表单基本元素的使用 69

5.5.1 单行文本输入框 69

5.5.2 多行文本输入框 70

5.5.3 密码域 70

5.5.4 单选按钮 71

5.5.5 复选框 72

5.5.6 下拉选择框 73

5.5.7 普通按钮 73

5.5.8 提交按钮 74

5.5.9 重置按钮 75

5.6 表单高级元素的使用 75

5.6.1 url属性的应用 76

5.6.2 email属性的应用 76

5.6.3 date和time属性的应用 76

5.6.4 number属性的应用 77

5.6.5 range属性的应用 78

5.6.6 required属性的应用 79

5.7 创建用户反馈表单 79

5.8 制作商品报价单 81

5.9 大神解惑 83

5.10 跟我练练手 84

第2篇 HTML5高级技术 88

第6章 HTML5快速入门 88

6.1 各大浏览器与HTML5的兼容性 88

6.2 检测浏览器是否支持HTML标记 88

6.3 语法变化和标记 89

6.3.1 HTML5的语法变化 89

6.3.2 HTML5中的标记方法 89

6.3.3 版本兼容性 90

6.4 新增的元素和废除的元素 91

6.4.1 新增的结构元素 92

6.4.2 新增的input元素类型 94

6.4.3 新增的其他元素 94

6.4.4 废除的元素 96

6.5 新增的属性和废除的属性 97

6.5.1 新增的属性 97

6.5.2 废除的属性 101

6.6 新增全局属性 103

6.6.1 contentEditable属性 103

6.6.2 designMode属性 103

6.6.3 hidden属性 104

6.6.4 spellcheck属性 104

6.6.5 tabIndex属性 104

6.7 大神解惑 106

6.8 跟我练练手 106

第7章 HTML5中的多媒体 108

7.1 网页音频标记 108

7.1.1 audio标记概述 108

7.1.2 audio标记的属性 108

7.1.3 音频解码器 109

7.1.4 浏览器对audio标记的支持情况 109

7.2 网页视频标记 109

7.2.1 video标记概述 109

7.2.2 video标记属性 110

7.2.3 视频解码器 110

7.2.4 浏览器对video标记的支持情况 111

7.3 添加网页音频文件 111

7.3.1 设置背景音乐 111

7.3.2 设置音乐循环播放 112

7.4 添加网页视频文件 112

7.4.1 为网页添加视频文件 112

7.4.2 设置自动运行 113

7.4.3 设置视频文件的循环播放 114

7.4.4 设置视频窗口的高度与宽度 114

7.5 添加网页滚动文字 115

7.5.1 滚动文字标记 115

7.5.2 滚动方向属性 116

7.5.3 滚动方式属性 117

7.5.4 滚动速度属性 117

7.5.5 滚动延迟属性 118

7.5.6 滚动循环属性 119

7.5.7 滚动范围属性 119

7.5.8 滚动背景颜色属性 120

7.5.9 滚动空间属性 121

7.6 大神解惑 122

7.7 跟我练练手 122

第8章 使用HTML5绘制图形 124

8.1 什么是canvas 124

8.2 绘制基本形状 125

8.2.1 绘制矩形 125

8.2.2 绘制圆形 126

8.2.3 使用moveTo与lineTo绘制直线 127

8.2.4 使用bezierCurveTo绘制贝塞尔曲线 128

8.3 绘制渐变图形 130

8.3.1 绘制线性渐变 130

8.3.2 绘制径向渐变 132

8.4 绘制变形图形 133

8.4.1 变换原点坐标 133

8.4.2 图形缩放 134

8.4.3 旋转图形 135

8.5 绘制其他样式的图形 136

8.5.1 图形组合 136

8.5.2 绘制带阴影的图形 138

8.5.3 绘制文字 139

8.6 使用图像 141

8.6.1 绘制图像 141

8.6.2 图像平铺 142

8.6.3 图像裁剪 143

8.6.4 像素处理 145

8.7 图形的保存与恢复 147

8.7.1 保存与恢复图形状态 147

8.7.2 保存文件 148

8.8 绘制火柴棒人物 149

8.9 绘制商标 151

8.10 大神解惑 153

8.11 跟我练练手 154

第3篇 用CSS美化网页 158

第9章 CSS概述与基本语法 158

9.1 CSS概述 158

9.1.1 CSS功能 158

9.1.2 浏览器与CSS的兼容性 158

9.1.3 CSS基础语法 159

9.1.4 CSS常用单位 159

9.2 编辑和浏览CSS 164

9.2.1 手工编写CSS 164

9.2.2 用Dreamweaver编写CSS 165

9.3 在HTML中使用CSS的方法 167

9.3.1 行内样式 167

9.3.2 内嵌样式 168

9.3.3 链接样式 169

9.3.4 导入样式 170

9.3.5 优先级问题 171

9.4 CSS的常用选择器 172

9.4.1 标记选择器 173

9.4.2 类选择器 173

9.4.3 ID选择器 174

9.4.4 全局选择器 175

9.4.5 组合选择器 175

9.4.6 继承选择器 176

9.4.7 伪类选择器 177

9.5 选择器声明 178

9.5.1 集体声明 178

9.5.2 多重嵌套声明 179

9.6 制作炫彩网站Logo 179

9.7 制作学生信息统计表 182

9.8 大神解惑 183

9.9 跟我练练手 184

第10章 美化网页字体与段落 186

10.1 美化网页文字 186

10.1.1 设置文字的字体 186

10.1.2 设置文字的字号 187

10.1.3 设置字体风格 188

10.1.4 设置加粗字体 189

10.1.5 将小写字母转换为大写字母 190

10.1.6 设置字体的复合属性 191

10.1.7 设置字体颜色 192

10.2 设置文本的高级样式 193

10.2.1 设置文本阴影效果 193

10.2.2 设置文本溢出效果 194

10.2.3 设置文本的控制换行 195

10.2.4 保持字体尺寸不变 196

10.3 美化网页中的段落 197

10.3.1 设置单词之间的间隔 197

10.3.2 设置字符之间的间隔 198

10.3.3 设置文字的修饰效果 199

10.3.4 设置垂直对齐方式 200

10.3.5 转换文本的大小写 202

10.3.6 设置文本的水平对齐方式 203

10.3.7 设置文本的缩进效果 205

10.3.8 设置文本的行高 205

10.3.9 文本的空白处理 206

10.3.1 0文本的反排 208

10.4 设置网页标题 209

10.5 制作新闻页面 211

10.6 大神解惑 212

10.7 跟我练练手 212

第11章 美化网页图片 214

11.1 图片缩放 214

11.1.1 通过描述标记width和height缩放图片 214

11.1.2 使用CSS中的max-width和max-height缩放图片 214

11.1.3 使用CSS中的width和height缩放图片 215

11.2 设置图片的对齐方式 216

11.2.1 设置图片横向对齐 216

11.2 2设置图片纵向对齐 217

11.3 图文混排 219

11.3.1 设置文字环绕效果 219

11.3.2 设置图片与文字的间距 220

11.4 制作学校宣传单 221

11.5 制作简单图文混排网页 223

11.6 大神解惑 225

11.7 跟我练练手 225

第12章 美化网页背景与边框 228

12.1 使用CSS美化背景 228

12.1.1 设置背景颜色 228

12.1.2 设置背景图片 229

12.1.3 背景图片重复 230

12.1.4 背景图片随文档滚动 231

12.1.5 背景图片位置 233

12.1.6 背景图片大小 234

12.1.7 背景显示区域 235

12.1.8 背景图像裁剪区域 237

12.1.9 背景复合属性 237

12.2 使用CSS美化边框 238

12.2.1 设置边框样式 238

12.2.2 设置边框颜色 239

12.2.3 设置边框线宽 240

12.2.4 设置边框复合属性 242

12.3 设置边框圆角效果 242

12.3.1 设置圆角边框 243

12.3.2 指定两个圆角半径 243

12.3.3 绘制四个不同的圆角边框 244

12.3.4 绘制不同种类的边框 245

12.4 制作简单公司主页 246

12.5 制作简单生活资讯主页 250

12.6 大神解惑 251

12.7 跟我练练手 252

第13章 美化表格和表单样式 254

13.1 美化表格样式 254

13.1.1 设置表格边框样式 254

13.1.2 设置表格边框宽度 255

13.1.3 设置表格背景颜色 256

13.2 美化表单样式 257

13.2.1 美化表单中的元素 257

13.2.2 美化提交按钮 259

13.2.3 美化下拉列表框 260

13.3 制作用户登录页面 262

13.4 制作用户注册页面 264

13.5 大神解惑 266

13.6 跟我练练手 266

第14章 美化超链接和鼠标指针 268

14.1 美化超链接 268

14.1.1 改变超链接基本样式 268

14.1.2 设置带有提示信息的超链接 269

14.1.3 设置超链接的背景图 270

14.1.4 设置超链接的按钮效果 271

14.2 美化鼠标特效 272

14.2.1 控制鼠标箭头 272

14.2.2 设置鼠标变幻式超链接 273

14.2.3 设置网页页面滚动条 274

14.3 图片版本超链接 276

14.4 鼠标特效实例 278

14.5 制作一个简单的导航栏 280

14.6 大神解惑 281

14.7 跟我练练手 282

第15章 控制网页导航菜单的样式 284

15.1 使用CSS美化项目列表 284

15.1.1 美化无序列表 284

15.1.2 美化有序列表 285

15.1.3 美化自定义列表 286

15.1.4 制作图片列表 287

15.1.5 缩进图片列表 288

15.1.6 列表复合属性 289

15.2 使用CSS制作网页菜单 290

15.2.1 制作无序列表的菜单 290

15.2.2 制作水平样式菜单 292

15.3 模拟SOSO导航栏 294

15.4 将段落转变成列表 297

15.5 大神解惑 299

15.6 跟我练练手 300

第4篇 网页布局和JavaScript 304

第16章 CSS+DIV盒子的浮动与定位 304

16.1 定义DIV 304

16.1.1 什么是DIV 304

16.1.2 创建DIV 304

16.2 盒子的定位 305

16.2.1 静态定位 305

16.2.2 相对定位 306

16.2.3 绝对定位 307

16.2.4 固定定位 308

16.2.5 盒子的浮动 308

16.3 其他CSS布局定位方式 310

16.3.1 溢出（overflow）定位 310

16.3.2 隐藏（visibility）定位 311

16.3.3 z-index空间定位 313

16.4 多列布局 314

16.4.1 设置列宽度 314

16.4.2 设置列数 316

16.4.3 设置列间距 317

16.4.4 设置列边框样式 318

16.5 定位网页布局样式 320

16.6 大神解惑 323

16.7 跟我练练手 324

第17章 网页布局剖析与制作 326

17.1 固定宽度网页剖析与布局 326

17.1.1 网页单列布局模式 326

17.1.2 网页1-2-1型布局模式 328

17.1.3 网页1-3-1型布局模式 330

17.2 自动缩放网页1-2-1型布局模式 333

17.2.1 1-2-1等比例变宽布局 333

17.2.2 1-2-1单列变宽布局 334

17.3 自动缩放网页1-3-1型布局模式 335

17.3.1 1-3-1三列宽度等比例布局 335

17.3.2 1-3-1单侧列宽度固定的变宽布局 335

17.3.3 1-3-1中间列宽度固定的变宽布局 337

17.3.4 1-3-1双侧列宽度固定的变宽布局 339

17.3.5 1-3-1中列和左侧列宽度固定的变宽布局 342

17.4 分列布局背景色的使用 344

17.4.1 设置固定宽度布局的列背景色 344

17.4.2 设置特殊宽度变化布局的列背景色 346

17.4.3 设置单列宽度变化布局的列背景色 347

17.4.4 设置多列等比例宽度变化布局的列背景 349

17.5 大神解惑 352

17.6 跟我练练手 352

第18章 JavaScript和jQuery 354

18.1 认识JavaScript 354

18.1.1 什么是JavaScript 354

18.1.2 在HTML网页头中嵌入JavaScript代码 354

18.2 JavaScript对象与函数 355

18.2.1 认识对象 356

18.2.2 认识函数 356

18.3 JavaScript事件 358

18.3.1 事件与事件处理概述 358

18.3.2 JavaScript的常用事件 359

18.4 认识jQuery 360

18.4.1 jQuery能做什么 361

18.4.2 jQuery的配置 361

18.5 jQuery选择器 362

18.5.1 jQuery的工厂函数 362

18.5.2 常见选择器 363

18.6 大神解惑 364

18.7 跟我练练手 365

第19章 经典的网页动态特效案例 368

19.1 文字特效 368

19.1.1 打字效果的文字 368

19.1.2 文字升降特效 370

19.1.3 跑马灯效果 372

19.2 图片特效 373

19.2 1 闪烁图片 373

19.2.2 左右移动的图片 375

19.3 网页菜单特效 378

19.3.1 向上滚动菜单 378

19.3.2 树形菜单 379

19.4 鼠标特效 384

19.4.1 鼠标的图片跟踪 384

19.4.2 鼠标的文字跟踪 385

19.5 时间特效 387

19.5.1 时钟特效 387

19.5.2 制作简单日历表 392

19.6 页面特效 395

19.6.1 网页自动滚屏 395

19.6.2 颜色选择器 398

19.7 大神解惑 401

19.8 跟我练练手 402

第5篇 综合案例实战 406

第20章 制作企业门户类网页 406

20.1 构思布局 406

20.1.1 设计分析 406

20.1.2 排版架构 407

20.2 模块分割 408

20.2.1 Logo与导航菜单 408

20.2.2 左侧文本介绍 410

20.2.3 右侧导航链接 411

20.2.4 版权信息 413

20.3 整体调整 414

第21章 制作在线购物类网页 416

21.1 整体布局 416

21.1.1 设计分析 416

21.1.2 排版架构 417

21.2 模块分割 417

21.2.1 Logo与导航区 417

21.2.2 Banner与资讯区 419

21.2.3 产品类别区域 420

21.2.4 页脚区域 421

第22章 制作移动设备类网页 424

22.1 网站设计分析 424

22.2 网站结构分析 424

22.3 网站主页面的制作 425

22.4 网站成品预览 427