Dreamweaver CS5网页设计与制作宝典

《dreamweaver cs5网页设计与制作宝典》

第1篇网页设计与制作基础篇

第1章解读网页设计 3

1.1网页设计概述 3

1.1.1网页与网站 3

1.1.2网页基本元素 4

1.1.3网页的类型 5

1.2网页设计的构成要素 6

1.2.1文字的编排与设计 6

1.2.2图形图像设计 7

1.2.3版式设计与编排 8

1.2.4色彩的搭配 8

1.2.5多媒体元素的选择 9

1.3网站建设的一般流程 10

1.3.1网站策划 10

1.3.2网页设计 13

1.3.3网页制作 14

1.3.4网站测试与发布 14

1.3.5网站宣传与维护 14

1.4网页常用专业术语 14

.第2章网页色彩搭配 19

2.1网页设计与色彩 19

2.2色彩理论 19

2.2.1色彩与视觉原理 19

2.2.2色彩三要素 20

2.2.3色相环 21

2.2.4三原色 22

2.3网页色彩技术 23

2.3.1216网页安全色 23

2.3.2html语言中的颜色值表示 24

2.4色彩的冷暖 25

2.5色彩对比 25

2.5.1色相对比 26

2.5.2明度对比 27

2.5.3纯度对比 28

2.5.4冷暖对比 28

2.5.5面积对比 29

2.6色彩调和 29

2.6.1同种色的调和 30

2.6.2类似色的调和 30

2.6.3对比色的调和 30

2.6.4渐变色的调和 31

2.7网页色彩搭配 32

2.7.1色彩的功能角色 32

2.7.2基于色相的配色 32

2.7.3基于色调的配色 38

2.7.4标准色配色 41

2.7.5渐变配色 41

第3章dreamweaver网页制作快速入门 43

3.1初识dreamweaver cs5 43

3.2熟悉中文版dreamweaver cs5的操作界面 43

3.2.1开始页 43

3.2.2dreamweaver cs5的操作界面 44

3.2.3主菜单、快捷菜单与面板菜单 46

3.2.4文档工具栏 48

3.2.5中文版dreamweaver cs5面板 52

3.3网页文档的基本操作 54

3.3.1新建网页 54

3.3.2保存网页 56

3.3.3设置页面属性 56

3.3.4打开网页 61

3.3.5预览网页 61

3.4关于站点 62

3.4.1本地站点和远程站点 62

3.4.2站点规划原则 62

3.5创建站点 63

3.5.1创建本地站点 63

3.5.2创建远程站点 66

3.6管理本地与远程站点 68

3.6.1管理本地站点中的文件 68

3.6.2管理本地站点 71

3.6.3管理远程站点 71

第4章xhtml和css基础 73

4.1xhtml语言基础 73

4.1.1什么是xhtml 73

4.1.2xhtml文档的基本结构 73

4.1.3标签的书写格式 76

4.1.4标签的属性 77

4.1.5xhtml语法规范 77

4.2xhtml语言的核心标签 79

4.2.1文本与段落 79

4.2.2图像 81

4.2.3超链接 81

4.2.4列表元素 82

4.2.5div标签 82

4.3css概述 84

4.3.1css的概念 84

4.3.2css的基本语法 84

4.3.3认识【css样式】面板 85

4.4使用css控制页面元素 86

4.4.1行内样式表 86

4.4.2内部样式表 86

4.4.3外部样式表 87

4.4.4导入样式表 88

4.5选择器类型 88

4.5.1标签选择器 88

4.5.2类选择器 91

4.5.3id选择器 92

4.6设置css属性 96

4.6.1设置css样式类型 96

4.6.2设置css样式背景 97

4.6.3设置css样式区块 98

4.6.4设置css样式的方框 99

4.6.5设置css样式的边框 100

4.6.6设置css 样式列表 101

4.6.7设置css样式的定位 102

4.6.8设置css样式扩展 104

4.7管理css样式表 104

4.7.1查看css样式 104

4.7.2编辑css样式 106

4.7.3禁用或启用css属性 106

4.7.4删除与复制css样式 107

第2篇网页元素设计篇

第5章网页中文字的编排与设计 111

5.1关于文字编排与设计 111

5.2文字在网页中的表现形式 112

5.2.1特效文字 112

5.2.2内容文字 113

5.3用css设计文字样式 113

5.3.1字体 113

5.3.2字号 116

5.3.3颜色 117

5.3.4字体粗细 118

5.3.5斜体 120

5.3.6下划线、上划线和删除线 121

5.3.7英文字母大小写 122

5.4用css设计文本的段落样式 123

5.4.1行高 124

5.4.2水平对齐方式 125

5.4.3首行缩进 126

5.4.4字间距 127

5.4.5首字下沉 128

5.5使用css滤镜设计特效文字 129

5.5.1滤镜概述 129

5.5.2阴影 130

5.5.3模糊 132

5.5.4光晕 133

5.5.5遮罩 134

5.5.6波浪 135

5.5.7射线 135

5.6实例应用——网页文字的排版 136

第6章网页中图形图像的设计 139

6.1网页图形图像概述 139

6.1.1图形图像在网页中的应用 139

6.1.2网页中图形图像的使用原则 141

6.1.3网页中常用图像格式 142

6.2在网页中添加图像 143

6.3用css设置网页图像样式 145

6.3.1设置图像的边框 145

6.3.2图片缩放 146

6.3.3图文混排 148

6.4用css设置网页的背景 150

6.4.1背景颜色 150

6.4.2背景图像 151

6.4.3设置背景图像的属性 151

6.5实例应用 155

6.5.1图文混排效果 155

6.5.2设计网页背景图像 162

第7章网页导航设计 165

7.1网页导航概述 165

7.1.1网页导航分类 165

7.1.2导航位置 168

7.1.3导航方向 169

7.2关于超链接 171

7.2.1什么是超链接 171

7.2.2链接路径 172

7.3创建超链接 173

7.3.1创建文本链接 173

7.3.2创建图像地图链接 177

7.3.3创建锚记链接 179

7.3.4创建电子邮件链接 182

7.3.5创建空链接和脚本链接 183

7.4用css设计网站导航 184

7.4.1链接样式的控制 184

7.4.2设计横向导航 185

7.4.3设计竖排导航 188

7.5实例应用——宝庆动漫网导航设计 189

第8章网页多媒体与特效设计 195

8.1插入多媒体对象 195

8.1.1插入swf动画 195

8.1.2插入flv视频 197

8.1.3添加声音 199

8.2使用行为创建网页特效 201

8.2.1 【行为】面板 202

8.2.2动作和事件 203

8.2.3添加行为 204

8.3dreamweaver中的常用行为介绍 206

8.3.1交换图像 206

8.3.2弹出信息 207

8.3.3打开浏览器窗口 207

8.3.4spry效果 208

8.3.5显示-隐藏元素 209

8.3.6检查插件 210

8.3.7设置状态栏文本 210

8.3.8调用javascript 211

8.3.9转到url 211

8.3.10预先载入图像 212

8.4行为实例应用 212

8.4.1制作闪烁图像特效 212

8.4.2制作有弹出窗口的网页 214

8.5关于javascript 217

8.5.1什么是javascript语言 218

8.5.2javascript语言的写入方式 218

8.6实例应用 219

8.6.1广告图片切换效果 219

8.6.2跟随滚动条滚动的对联广告 225

第3篇网页版式设计与布局篇

第9章网页版式设计 231

9.1版式设计概述 231

9.1.1网页版面大小 231

9.1.2第一屏 233

9.2版式设计的形式原理 233

9.2.1比例 234

9.2.2重复与渐变 234

9.2.3对称与均衡 236

9.2.4节奏与旋律 236

9.2.5对比与统一 237

9.2.6虚实与留白 238

9.3版式设计的视觉因素 239

9.3.1符合人的视觉习惯 239

9.3.2避免视觉疲劳 240

9.3.3注重主从关系 241

9.4网页版式构成的基础结构 243

9.4.1栏式结构 243

9.4.2区域结构 245

9.4.3非规律框架 246

第10章表格布局网页 249

10.1使用表格 249

10.1.1创建表格 249

10.1.2选择表格 250

10.2设置表格与单元格的属性 251

10.2.1设置表格属性 252

10.2.2设置单元格属性 252

10.3编辑表格 253

10.3.1调整表格和单元格的大小 253

10.3.2设置表格对齐方式 255

10.3.3插入行或列 256

10.3.4删除行或列 257

10.3.5拆分和合并单元格 257

10.3.6表格的嵌套 258

10.4实例应用——制作models俱乐部网站 258

10.4.1使用表格布局页面 259

10.4.2使用css美化页面 263

第11章深入理解css+div布局 269

11.1css+div布局概述 269

11.1.1什么是css+div布局 269

11.1.2css的优势 269

11.1.3传统的table布局与css布局的区别 270

11.2关于div和span 272

11.2.1认识div 272

11.2.2div的并列与嵌套结构 274

11.2.3div与span的区别 275

11.3盒子模型 276

11.3.1盒子模型的概念 276

11.3.2border 277

11.3.3padding 279

11.3.4margin 280

11.4元素的定位方式 283

11.4.1float定位 283

11.4.2position定位 285

11.4.3z-index空间位置 287

第12章css+div布局网页 289

12.1css布局技法 289

12.1.1将页面用div分块 289

12.1.2设计各个块的位置 290

12.1.3用css定位 290

12.2常用布局类型 292

12.2.1一列固定宽度 292

12.2.2一列自适应 294

12.2.3一列固定宽度居中 295

12.2.4两列固定宽度 296

12.2.5两列宽度自适应 298

12.2.6两列右列宽度自适应 299

12.2.7两列固定宽度居中 300

12.2.8三列浮动中间列宽度自适应 302

12.2.9高度自适应 304

12.3使用css预设布局创建页面 305

12.4实例应用——制作蝴蝶摄影工作室网站 307

12.4.1搭建html框架 308

12.4.2制作网页头部 310

12.4.3制作网页的主要内容和页尾 315

12.4.4制作“蝴蝶作品”页面 317

第4篇经典案例篇

第13章艺萃商业网站的设计与制作 323

13.1商业网站的策划 323

13.1.1明确创建网站的目的和用户需求 323

13.1.2分析材料 324

13.1.3出具网站策划书 324

13.2艺萃商业网站的设计 326

13.2.1设计定位 327

13.2.2确定网站结构布局 329

13.3艺萃商业网站的制作 329

13.3.1创建本地站点与远程站点 329

13.3.2定义页面通用样式 332

13.4制作首页 334

13.4.1新建文档并链接样式表文件 334

13.4.2使用div搭建页面框架 335

13.4.3用css定位并添加内容 336

13.4.4插入关键字和网页说明 338

13.5栏目页面的制作 339

13.5.1新建文档并链接样式表文件 339

13.5.2使用div搭建页面框架 340

13.5.3制作头部内容 341

13.5.4制作主体内容 342

13.5.5制作页脚 346

13.6测试与发布网站 347

13.6.1网站的测试 347

13.6.2网站的发布 349

第14章省客网的设计与制作 351

14.1省客网的设计 351

14.2省客网的制作 353

14.2.1创建本地站点与远程站点 353

14.2.2新建样式表并设置通用样式 354

14.3制作首页 358

14.3.1新建网页并调用style.css

样式表 358

14.3.2使用div搭建页面框架 359

14.3.3制作网站头部 360

14.3.4制作网站导航 361

14.3.5制作网页主体 364

14.3.6制作网页脚注 376

第15章希艺欧家居网的设计与制作 377

15.1案例预览 377

15.2创建与编辑模板 378

15.2.1认识【模板】面板和【模板】菜单 378

15.2.2创建模板 380

15.2.3编辑模板 383

15.2.4管理模板 386

15.3应用模板制作网页 386

15.3.1从模板新建网页文件 387

15.3.2使用【模板】面板创建网页文档 388

15.3.3页面与模板脱离 389

15.3.4更新页面 389

15.4使用库 390

15.4.1库的概念 390

15.4.2创建和应用库项目 391

15.4.3修改库 392

15.5制作希艺欧家居网站 392

15.5.1创建站点并定义页面通用样式 393

15.5.2创建模板并链接样式表文件 395

15.5.3使用div搭建页面框架 396

15.5.4定位块并添加内容 397

15.5.5应用模板制作“公司简介”页面 406

15.5.6应用模板制作“人才中心”页面 408