网页制作与网站开发从入门到精通PDF电子书下载

第1章 标准网页设计概述 1

（本章视频长度：25分58秒）1.1 Web标准发展概述 1

1.2 什么是网页标准 2

1.2.1 网页结构化语言 3

1.2.2 网页表现语言 4

1.2.3 网页行为语言 4

1.3 学习标准设计将会给你带来什么 4

1.3.1 对于用户来说，更易用 5

1.3.2 对于设计者来说，更高效 5

1.3.3 对于服务来说，成本更低 5

1.4 学习标准设计中应注意的问题 6

1.4.1 不要为了验证而验证 6

1.4.2 不要被传统布局思维所束缚 6

1.4.3 不要乱用标签和属性 7

1.5 如何学习标准网页设计 8

1.5.1 一位拓荒者的标准学习之路 8

1.5.2 你需要准备什么 9

第2章 Demo，一起体验标准化设计流程 11

（本章视频长度：20分33秒）2.1 与客户交流获取资料 11

2.1.1 不要张口就问设计效果 11

2.1.2 向客户获取有价值的资料 12

2.2 构建符合语义的结构 13

2.2.1 不要使用表格设计结构 13

2.2.2 不要把结构当作段落文本 13

2.2.3 div不是万能的 14

2.2.4 使用符合语义的元素 15

2.3 与客户沟通并设计页面表现效果 16

2.3.1 不要为了设计样式而随意设置id属性和class属性 17

2.3.2 设计精致典雅的界面风格 19

2.3.3 设计个性洒脱的界面风格 21

第3章 HTML语言基础 24

（本章视频长度：36分12秒）3.1 HTML语言概述 24

3.1.1 认识HTML语言 24

3.1.2 HTML语言的发展历史 26

3.2 HTML语言规范 28

3.2.1 HTML文档结构 28

3.2.2 HTML基本语法 31

3.3 HTML文档类型和名字空间 32

3.3.1 认识DOCTYPE 33

3.3.2 DOCTYPE结构分析 33

3.3.3 HTML文档类型分类 34

3.3.4 HTML文档类型使用误区 35

3.3.5 探析文档类型定义（DTD） 36

3.3.6 名字空间 37

3.4 HTML文档元信息 39

第4章 HTML元素的语义性及其使用 41

（本章视频长度：58分36秒）4.1 网页语义化概述 41

4.1.1 什么是语义化网页 41

4.1.2 HTML语义化现状和发展 42

4.2 HTML元素的语义分类 43

4.2.1 结构语义元素 43

4.2.2 内容语义元素 44

4.2.3 修饰语义元素 44

4.3 HTML属性的语义分类 45

4.3.1 核心语义属性 45

4.3.2 语言语义属性 45

4.3.3 键盘语义属性 46

4.3.4 内容语义属性 46

4.3.5 其他语义属性 48

4.4 文本信息的语义结构 49

4.4.1 标题信息的语义结构 49

4.4.2 段落信息的语义结构 51

4.4.3 引用信息的语义结构 52

4.4.4 强调信息的语义结构 54

4.4.5 格式化文本的语义结构 54

4.4.6 输出信息的语义结构 55

4.4.7 信息缩写的语义结构 57

4.4.8 插入和删除信息的语义结构 57

4.4.9 其他文本信息的语义结构 58

4.5 列表信息的语义结构 59

4.5.1 认识列表结构 59

4.5.2 使用普通列表结构 60

4.5.3 使用定义列表结构 62

4.5.4 使用定义列表的误区 64

4.6 数据表格的语义化结构 65

4.6.1 认识数据表的结构 65

4.6.2 使用表格元素 67

4.6.3 数据分组 69

4.7 表单的语义化基本结构 71

4.7.1 认识表单的结构 71

4.7.2 认识表单元素 72

4.7.3 form元素 73

4.7.4 input元素 75

4.7.5 textarea和select元素 76

4.8 表单结构的语义化高级设计 78

4.8.1 表单分组 78

4.8.2 绑定提示标签到表单域 80

4.8.3 快捷键、访问键和禁止访问 81

4.8.4 select选项分区 81

4.8.5 使用按钮 82

第5章 网页结构化实施与应用 83

（本章视频长度：46分5秒）5.1 HTML元素的显示类型 83

5.1.1 认识元素显示类型 83

5.1.2 块状元素 84

5.1.3 行内元素 85

5.1.4 其他元素 85

5.2 HTML结构嵌套规则详解 86

5.2.1 结构乱套何时休 86

5.2.2 (X)HTML Strict下嵌套规则 87

5.2.3 HTML嵌套规则解析 90

5.3 解析Stopdesign的结构 92

5.3.1 认识Stopdesign 93

5.3.2 Stopdesign首页内容版块分析 95

5.3.3 构建基本结构 95

5.3.4 构建微观结构 97

5.3.5 结构的SEO设计 100

5.3.6 版式结构设计 102

5.4 解析CSS ZEN GARDEN结构 103

5.4.1 认识CSS禅意花园 103

5.4.2 禅意花园内容版块分析 105

5.4.3 构建禅意花园的基本结构 108

5.4.4 构建禅意花园的微观结构 109

5.4.5 版式结构设计 112

第6章 CSS语言基础 114

（本章视频长度：33分25秒）6.1 创建CSS样式 114

6.1.1 网页样式发展概述 114

6.1.2 CSS样式的构成 115

6.2 应用CSS样式 117

6.2.1 行内样式 117

6.2.2 内部样式 118

6.2.3 外部样式 121

6.2.4 引入外部样式 121

6.3 准确选用CSS选择器 123

6.3.1 基本选择器 123

6.3.2 选定范围？选择器 126

6.3.3 属性选择器 129

6.3.4 选择器分组、嵌套和指定 131

6.4 灵活使用CSS的层叠和继承 133

6.4.1 CSS的层叠性 134

6.4.2 CSS的继承性 136

第7章 设计网页文本格式和段落版式 138

（本章视频长度：60分24秒）7.1 字体样式 138

7.1.1 字体类型 138

7.1.2 字体大小 140

7.1.3 字体颜色 142

7.1.4 字体粗细 143

7.1.5 斜体 143

7.1.6 下划线 144

7.1.7 大小写 145

7.2 段落格式 146

7.2.1 水平对齐 146

7.2.2 垂直对齐 148

7.2.3 字距和词距 151

7.2.4 行高 152

7.2.5 首行缩进 155

7.3 网页文本格式实战 156

7.3.1 宁静、含蓄的英文格式 156

7.3.2 干练、洒脱的英文格式 159

7.3.3 层级式中文格式 160

7.3.4 报刊式中文格式 163

第8章 网页图像美化与设计 166

（本章视频长度：74分41秒）8.1 图像样式 166

8.1.1 图像大小 166

8.1.2 图像边框 168

8.1.3 图像透明度 171

8.1.4 图像位置 172

8.2 控制背景图像 174

8.2.1 定义背景图像 174

8.2.2 背景图像显示方式 175

8.2.3 背景图像位置 176

8.2.4 固定背景图像 180

8.2.5 灵活使用背景图像 181

8.3 网页图像设计实战 182

8.3.1 博客主页中的图像应用 182

8.3.2 网络相册中的图像应用 187

第9章 设计超链接样式 193

（本章视频长度：43分35秒）9.1 超链接基本样式 193

9.1.1 简单认识超链接 193

9.1.2 伪类和伪对象 194

9.1.3 超链接基本样式 195

9.2 设计超链接样式 198

9.2.1 下划线样式 198

9.2.2 立体样式 200

9.2.3 动态样式 202

9.2.4 图像样式 203

9.2.5 鼠标样式 205

第10章 设计列表和菜单样式 207

（本章视频长度：53分9秒）10.1 列表基本样式 207

10.1.1 定义列表的基本样式 207

10.1.2 自定义项目符号 208

10.1.3 使用背景图像定义项目符号 209

10.2 列表布局 210

10.2.1 垂直布局样式 211

10.2.2 水平布局样式 214

10.3 菜单样式设计 217

10.3.1 滑动样式（上） 217

10.3.2 滑动样式（下） 219

10.3.3 Tab样式 222

10.3.4 导航下拉面板样式 225

第11章 设计表格样式 228

（本章视频长度：65分33秒）11.1 表格基本样式设计 228

11.1.1 使用表格属性设计样式 228

11.1.2 使用CSS设计表格边框 230

11.1.3 单元格分离和补白样式 232

11.1.4 空单元格显示处理 233

11.1.5 单元格数据水平对齐和垂直对齐 234

11.2 表格布局模型和高级样式设计 236

11.2.1 表格布局模型 236

11.2.2 数据列和行的样式 238

11.2.3 表格标题的样式 241

11.2.4 合并单元格 243

11.2.5 数据表格内元素层叠优先级 244

11.3 表格样式设计实战 246

11.3.1 清新悦目的数据表样式 246

11.3.2 层次清晰的数据表样式 248

第12章 标准网页布局的基本方法 252

（本章视频长度：93分58秒）12.1 标准网页布局概述 252

12.1.1 标准网页布局的基本元素 252

12.1.2 网页元素的显示属性 254

12.1.3 标准网页布局类型 254

12.2 CSS盒模型 258

12.2.1 认识盒模型 259

12.2.2 盒模型的边界 259

12.2.3 边界重叠 261

12.2.4 盒模型的边框 263

12.2.5 边框样式的使用技巧 265

12.2.6 盒模型的补白 267

12.3 标准网页布局的基本方法 268

12.3.1 float浮动布局 268

12.3.2 浮动清除 272

12.3.3 position定位布局 274

12.3.4 定位元素的层叠顺序 279

12.4 标准网页布局实战技巧 280

12.4.1 布局居中技巧 281

12.4.2 灵活设计定位布局 284

12.4.3 浮动布局的高度自适应 287

12.4.4 使用负边界改善浮动布局 289

第13章 标准网页布局的兼容性处理 292

（本章视频长度：96分16秒）13.1 兼容不同类型浏览器的基本方法 292

13.1.1 常用过滤器 292

13.1.2 使用IE条件语句过滤 294

13.2 流动布局的兼容性处理 296

13.2.1 关于不同浏览器的默认值问题 296

13.2.2 列表兼容性处理——有序列表高度问题 297

13.2.3 列表兼容性处理——列表宽度问题 298

13.2.4 列表兼容性处理——项目符号变异问题 299

13.2.5 列表兼容性处理——列表行双倍高度问题 300

13.2.6 列表兼容性处理——列表项错行问题 301

13.2.7 默认高度问题 302

13.2.8 盒模型高和宽的计算问题 304

13.2.9 最小高度和宽度问题 305

13.2.10 超链接兼容处理——失控的子标签问题 305

13.2.11 超链接兼容处理——使用背景图像代替文本问题 306

13.3 浮动布局的兼容性处理 307

13.3.1 浮动被流动包含问题 308

13.3.2 包含框不能自适应高度的问题 310

13.3.3 浮动布局中栏目内容被隐藏的问题 311

13.3.4 同时设置边界和浮动布局的问题 313

13.3.5 半个像素问题 314

13.3.6 3像素问题 316

13.3.7 多出字符问题 318

13.4 定位布局的兼容性处理 318

13.4.1 定位参照物的问题 318

13.4.2 定位元素的结构与层叠问题 320

13.4.3 定位元素丢失问题 322

第14章 JavaScript语言基础 325

（本章视频长度：152分6秒）14.1 JavaScript概述 325

14.1.1 网页中的JavaScript 325

14.1.2 Hello,World 328

14.1.3 JavaScript脚本块在网页中的处理 330

14.1.4 使用外部JavaScript文件 331

14.1.5 JavaScript文件的关联和冲突处理 333

14.1.6 JavaScript和CSS文件URL引用和执行问题 336

14.1.7 JavaScript编辑工具 338

14.2 JavaScript语言的体系结构 339

14.2.1 JavaScript语言的数据结构 339

14.2.2 JavaScript语言的文法结构 341

14.3 常量和变量 344

14.4 表达式和运算符 345

14.5 控制语句 349

14.5.1 表达式语句和语句块 349

14.5.2 条件语句 349

14.5.3 循环语句 352

14.5.4 跳转语句 354

14.5.5 异常处理语句 355

14.5.6 var语句和function语句 356

14.5.7 with语句和空语句 357

14.6 数据类型 358

14.6.1 数值 358

14.6.2 字符串 359

14.6.3 布尔型 359

14.6.4 null和undefined 359

14.6.5 其他数据类型 359

14.7 函数 359

14.7.1 定义函数 360

14.7.2 调用函数 360

14.7.3 函数的参数 361

14.7.4 函数常量 362

14.7.5 闭包函数 363

14.8 对象 364

14.8.1 对象的属性和方法 364

14.8.2 增加和删除对象属性 366

14.8.3 销毁对象 367

14.8.4 内置对象 367

14.9 数组 367

14.9.1 定义数组 368

14.9.2 存取数组元素 368

14.9.3 数组的存取和增删 368

14.9.4 数组高级操作 370

第15章 精通DOM文档对象模型 372

（本章视频长度：53分48秒）15.1 认识DOM 372

15.1.1 浏览器对象模型 372

15.1.2 标准文档对象模型 374

15.1.3 DOM中的节点 375

15.2 文档基本操作 377

15.2.1 遍历文档 377

15.2.2 增加文档内容 380

15.3 节点基本操作 382

15.3.1 获取节点 382

15.3.2 创建节点 384

15.3.3 复制节点 386

15.3.4 插入节点 388

15.3.5 删除节点 391

15.3.6 替换节点 393

15.4 属性基本操作 395

15.4.1 获取节点属性 395

15.4.2 设置节点属性 395

15.4.3 删除节点属性 396

第16章 掌握JavaScript事件处理模型 398

（本章视频长度：49分40秒）16.1 事件处理模型概述 398

16.1.1 认识事件 398

16.1.2 事件流 399

16.1.3 事件处理模型 401

16.2 基本事件模型 401

16.2.1 事件类型 401

16.2.2 绑定事件 402

16.2.3 事件处理的返回值 403

16.2.4 事件处理的参数 403

16.2.5 事件处理程序中的this关键字 404

16.3 标准事件模型 405

16.3.1 事件传播 406

16.3.2 事件注册 406

16.3.3 为对象注册多个事件处理程序 408

16.3.4 事件模块和事件类型 408

16.3.5 剖析Event 410

16.3.6 兼容不同浏览器的事件处理方法 411

16.4 IE事件模型 412

16.4.1 事件注册 412

16.4.2 Event对象 413

16.4.3 Event应用 413

16.5 事件处理实战 414

16.5.1 定义Tab面板的结构和样式 414

16.5.2 方法一：在标签属性中绑定事件处理函数 416

16.5.3 方法二：在脚本中注册Tab面板的操作事件 418

16.5.4 方法三：使用标准事件模型设计Tab面板功能 420

第17章 使用JavaScript动态控制CSS样式 422

（本章视频长度：78分10秒）17.1 脚本化CSS 422

17.1.1 认识样式的脚本属性 422

17.1.2 CSS在DHTML中的作用 427

17.2 脚本中的行内样式 428

17.2.1 脚本中样式属性名使用规范 428

17.2.2 style对象及其方法 429

17.3 脚本中的样式表 432

17.3.1 认识styleSheets集合 432

17.3.2 styleSheets集合索引 434

17.3.3 操作CSS规则 435

17.3.4 获取显示样式 438

17.4 脚本样式实战 439

17.4.1 换皮肤1 440

17.4.2 换皮肤2 441

17.4.3 折叠块1 444

17.4.4 折叠块2 446

17.4.5 提示框1 450

17.4.6 提示框2 452

第18章 使用Ajax技术实现动态数据交互 455

（本章视频长度：75分7秒）18.1 认识Ajax 455

18.1.1 什么是Ajax 455

18.1.2 如何学习Ajax 456

18.2 使用XMLHttpRequest对象 457

18.2.1 创建XMLHttpRequest对象实例 457

18.2.2 创建兼容性XMLHttpRequest对象 458

18.2.3 创建动态XMLHttpRequest对象 460

18.2.4 模拟本地服务器环境 460

18.2.5 准备前后台信息交互文件 462

18.2.6 使用XMLHttpRequest发送请求 463

18.2.7 回调 465

18.2.8 处理服务器响应 466

18.3 Ajax信息交互实战 468

18.3.1 Ajax显示前后台数据交互过程 469

18.3.2 Ajax显示记录集 471

18.3.3 Tab面板数据异步更新 476

18.3.4 Ajax记录集分页显示 479

18.3.5 Ajax关键词快速匹配 483

第19章 使用jQuery框架扩展JavaScript的功能 487

（本章视频长度：88分16秒）19.1 JQuery技术框架概述 487

19.2 JQuery构造器 488

19.3 JQuery基本用法 490

19.3.1 访问jQuery对象 490

19.3.2 访问DOM对象的属性 492

19.3.3 访问DOM样式类 493

19.3.4 访问DOM元素包含信息 494

19.4 JQuery选择器 497

19.4.1 常用选择器 497

19.4.2 伪选择器 498

19.4.3 表单专用选择器 500

19.4.4 筛选函数 501

19.5 文档处理 503

19.5.1 插入内容 503

19.5.2 嵌套结构 505

19.5.3 替换结构 506

19.5.4 删除和克隆结构 506

19.6 CSS处理 507

19.6.1 css（）方法 508

19.6.2 位移 508

19.6.3 显示大小 509

19.7 事件处理 509

19.7.1 页面初始化事件 510

19.7.2 绑定事件 510

19.7.3 交互事件 513

19.7.4 封装默认事件 514

19.8 动画处理 515

19.8.1 基本动画 515

19.8.2 滑动动画 516

19.8.3 淡入淡出 517

19.9 Ajax技术处理 517

19.9.1 Ajax请求 518

19.9.2 jQuery.ajax（）请求 519

19.9.3 Ajax事件 521

19.10 JQuery实战 522

19.10.1 图片画廊 522

19.10.2 收缩置顶条 524

19.10.3 超级链接类型标识图标 526

第20章 使用Dreamweaver构建HTML结构 529

（本章视频长度：46分54秒）20.1 可视化网页编辑工作流 529

20.1.1 可视化构建HTML结构 529

20.1.2 梳理Dreamweaver的可视化操作思路 533

20.1.3 亲近Dreamweaver可视化设计环境 534

20.2 HTML代码编辑工作流 536

20.2.1 代码编辑环境 537

20.2.2 代码输入智能化提示 538

20.2.3 代码格式化与排版 540

20.2.4 代码分色显示 545

20.2.5 选择代码 545

20.2.6 快速编辑代码 546

20.2.7 代码检查和修改 547

20.2.8 代码验证服务 549

第21章 使用Dreamweaver设计CSS样式 551

（本章视频长度：47分24秒）21.1 从【CSS样式】面板开始 551

21.1.1 认识【CSS样式】面板 551

21.1.2 建立CSS样式工作流 554

21.1.3 应用CSS样式工作流 556

21.2 Dreamweaver的CSS操作环境 558

21.2.1 强大的可视化渲染功能 558

21.2.2 代码与可视化编辑的无障碍服务 560

21.2.3 CSS辅助工具 562

21.3 Dreamweaver布局实战 564

21.3.1 页面属性初始化 565

21.3.2 页面基本结构布局 566

21.3.3 页面基本模块样式 567

第22章 使用Dreamweaver开发JavaScript脚本 569

（本章视频长度：39分25秒）22.1 Dreamweaver中的JavaScript 569

22.1.1 结构和逻辑的分离 569

22.1.2 JavaScript智能化提示 571

22.1.3 支持第三方Ajax框架和技术库 572

22.1.4 JavaScript行为特效 573

22.1.5 JavaScript代码片段 574

22.2 使用Dreamweaver的Spry技术框架 575

22.2.1 定义Spry数据集 575

22.2.2 绑定Spry数据集 578

22.2.3 Spry构件 580

22.2.4 Spry表单验证 582

22.2.5 Spry特效 584

第23章 综合实战：专题资讯 586

（本章视频长度：44分22秒）23.1 设计概述 586

23.2 构建主题页面结构 587

23.2.1 宏观结构设计 587

23.2.2 微观结构设计 589

23.3 页面布局和样式设计 592

23.3.1 布局思路 592

23.3.2 基本布局和样式 593

23.3.3 浏览器兼容处理 595

23.4 页面动态效果设计 598

23.4.1 动态下拉菜单 598

23.4.2 延迟的下拉菜单 600

23.4.3 自定义折叠面板 601

23.4.4 左右推拉面板 602

23.4.5 使用Spry技术设计折叠面板 603

第24章 综合实战：电子相册 608

（本章视频长度：59分55秒）24.1 策划思路和XML数据设计 608

24.1.1 电子相册功能演示 608

24.1.2 策划思路 609

24.1.3 设计XML数据结构 610

24.2 相册结构构建 611

24.2.1 构建宏观结构 611

24.2.2 细化微观结构 612

24.3 相册布局与样式设计 613

24.3.1 基本布局思路 614

24.3.2 设计默认样式和基本框架 614

24.3.3 局部样式设计 616

24.3.4 浏览器兼容性处理 619

24.3.5 皮肤设计 621

24.4 逻辑层开发 622

24.4.1 动态更换皮肤 622

24.4.2 使用Spry技术读取XML数据 623

24.4.3 初始化XML DOM控件 626

24.4.4 读取并显示分类导航信息 626

24.4.5 读取并显示缩微图信息 629

24.4.6 完善鼠标操作的动感效果 630