Dreamweaver CC网页创意设计案例课堂(第2版)(含光盘)

《Dreamweaver CC 网页创意设计案例课堂(D2版)》根据使用Dreamweaver CC 2017进行网页设计与制作的特点，精心设计了75个案例精讲，由YX的平面设计教师编写，循序渐进地讲解了使用Dreamweaver CC 2017制作和设计专业网页作品所需要的全部知识。 《Dreamweaver CC 网页创意设计案例课堂(D2版)》共分为9章，讲解网页开发语言入门、Dreamweaver CC 2017的基本操作、休闲类网页的设计、电脑网络类网页的设计、商业经济类网页的设计、教育培训类wz的设计、艺术爱好类wz的设计、旅游交通类wz的设计、生活服务类wz的设计等内容，通过大量的案例精讲帮助读者全面掌握网页制作的方法和操作技巧等。 《Dreamweaver CC 网页创意设计案例课堂(D2版)》采用案例教程的编写形尸兼具技术手册和应用专著的特点，附带的DVD教学光盘如教师亲自授课一样讲解，内容全面、结构合理、图文并茂、案例精讲丰富、讲解清晰，不仅适合广大图像设计初级、中级爱好者的使用，也可以作为大中专院校相关专业，以及社会各类初、中级网页培训班的教学用书。 《Dreamweaver CC 网页创意设计案例课堂(D2版)》配套光盘内容为本书所有案例精讲的素材文件、效果文件，以及案例精讲的视频教学文件。

《Dreamweaver CC 网页创意设计案例课堂(D2版)》以75 个精彩实例向读者详细介绍了Dreamweaver CC 2017 强大的网页制作功能。《Dreamweaver CC 网页创意设计案例课堂(D2版)》注重理论与实践紧密结合，实用性和可操作性强，相对于同类Dreamweaver CC 2017 实例书籍，本书具有以下特色：

（1） 信息量大。75 个实例为每一位读者架起一座快速掌握Dreamweaver CC 使用与操作的“桥梁”；75 种设计理念令每一个从事网页设计的专业人士在工作中灵感迸发；75 种艺术效果和制作方法使每一位初学者融会贯通、举一反三。

（2） 实用性强。75 个实例经过精心设计、选择，不仅效果精美，而且FC实用。

（3） 注重方法的讲解与技巧的总结。本书特别注重对各实例制作方法的讲解与技巧总结，在介绍具体实例制作的详细操作步骤的同时，对于一些重要而常用的实例制作方法和操作技巧做了较为精辟的总结。

（4） 操作步骤详细。本书中各实例的操作步骤介绍FC详细，即使是初级入门的读者，只需一步一步按照本书中介绍的步骤进行操作，一定能做出相同的效果。

（5） 适用广泛。本书实用性和可操作性强，适合广大网页设计爱好者使用，也可以作为职业学校和计算机学校相关专业的教材。

（6）海量的学习资源和素材

《Dreamweaver CC 网页创意设计案例课堂(D2版)》附带一张DVD 教学光盘，内容包括本书所有素材文件、场景文件、效果文件、多媒体有声视频教学录像，读者在读完本书内容以后，可以调用这些资源进行深入练习。

 

目 录 D1 章 网页开发语言入门 案例精讲001 熟悉HTML 2 案例精讲002 HTML 的编写要求 3 案例精讲003 body 属性 4 案例精讲004 文字属性 5 案例精讲005 在网页中插入图像 6 案例精讲006 表格的使用 7 案例精讲007 表单的使用 8 案例精讲008 CJ链接的使用 11 案例精讲009 的基本信息 12 案例精讲010 的变量 13 案例精讲011 的运算符 13 案例精讲012 对事件作出反应 14

目 录

D1 章  网页开发语言入门

案例精讲001 熟悉HTML              2

案例精讲002 HTML 的编写要求           3

案例精讲003 body 属性              4

案例精讲004 文字属性              5

案例精讲005 在网页中插入图像          6

案例精讲006 表格的使用             7

案例精讲007 表单的使用             8

案例精讲008 CJ链接的使用          11

案例精讲009 的基本信息        12

案例精讲010 的变量          13

案例精讲011 的运算符         13

案例精讲012 对事件作出反应      14

案例精讲013 通过 改变HTML 内容    14

案例精讲014 通过 改变图像       15

案例精讲015 通过 改变HTML 样式    16

案例精讲016 PHP 简介             17

案例精讲017 PHP 的常量与变量         18

案例精讲018 PHP 的运算符           18

D2 章  Dreamweaver CC 2017 的基本操作

案例精讲019 Dreamweaver CC 2017 的安装    22

案例精讲020 Dreamweaver CC 2017 的卸载    23

案例精讲021 Dreamweaver CC 2017 的启动与退出   24

案例精讲022 站点的建立            25

案例精讲023 站点的管理            26

案例精讲024 页面属性的设置          31

案例精讲025 多媒体文件的添加         37

案例精讲026 E- 链接            41

案例精讲027 鼠标经过图像           43

案例精讲028 出信息设置           44

案例精讲029 设置空链接            46

D3 章  休闲类网页的设计

案例精讲030 麦克疯音乐网页的设计       52

案例精讲031 速播电影网页的设计【视频案例】   61

案例精讲032 嘟嘟交友网页的设计【视频案例】   62

案例精讲033 媚图吧网页的设计【视频案例】    62

案例精讲034 下载吧网页的设计         63

案例精讲035 网络游戏网页的设计        73

案例精讲036 足球体育网页的设计        80

D4 章  电脑网络类网页的设计

案例精讲037 IT 信息wz            92

案例精讲038 技术wz【视频案例】       97

案例精讲039 人民信息港【视频案例】      98

案例精讲040 绿色软件wz           98

案例精讲041 设计wz             106

案例精讲042 速腾科技网页的设计【视频案例】            110

案例精讲043 个人博客wz           110

D5 章  商业经济类网页的设计

案例精讲044 申通物流网页           120

案例精讲045 恒洁卫浴网页           131

案例精讲046 宏泰投资网页【视频案例】     139

案例精讲047 凯莱顿酒店网页【视频案例】    139

案例精讲048 尼罗河汽车网页【视频案例】    140

案例精讲049 莱特易购网            141

案例精讲050 美食网              150

D6 章  教育培训类wz的设计

案例精讲051 天使宝贝（一）          164

案例精讲052 天使宝贝（二）【视频案例】    183

案例精讲053 天使宝贝（三）【视频案例】    183

案例精讲054 小学wz网页的设计        184

案例精讲055 兴德教师招聘网【视频案例】    196

案例精讲056 新起点图书馆【视频案例】     197

D7 章  艺术爱好类wz的设计

案例精讲057 酷图网网页的设计         200

案例精讲058 书画网网页的设计         210

案例精讲059 唐人戏曲网页的设计【视频案例】  217

案例精讲060 婚纱摄影网页的设计【视频案例】  218

案例精讲061 家居wz的设计          219

案例精讲062 工艺品wz的设计【视频案例】   225

D8 章  旅游交通类wz的设计

案例精讲063 驰飞网网页的设计         228

案例精讲064 天气预报网网页的设计       248

案例精讲065 黑蚂蚁欢乐谷网页的设计（一）【视频案例】            262

案例精讲066 黑蚂蚁欢乐谷网页的设计（二）【视频案例】            263

案例精讲067 旅游wz（一）          263

案例精讲068 旅游wz（二）          288

案例精讲069 旅游wz（三）          300

D9 章  生活服务类wz的设计

案例精讲070 礼品网wz            312

案例精讲071 鲜花网wz（一）         331

案例精讲072 鲜花网wz（二）         343

案例精讲073 装饰公司wz（一）        350

案例精讲074 装饰公司wz（二）        360

案例精讲075 装饰公司wz（三）        372

显示全部信息


D2章 Dreamweaver CC 2017的基本操作 本章重点 Dreamweaver CC 2017的安装 Dreamweaver CC 2017的卸载 Dreamweaver CC 2017的启动与退出 站点的建立 站点的管理 页面属性的设置 多媒体文件的添加 E- 链接 鼠标经过图像 出信息设置 设置空链接 Dreamweaver与其他设计类软件的基本操作方法不同，对于初学者来说，初次使用Dreamweaver会有许多困惑。为了方便后面章节的学习，在本章中将学习安装、卸载、启动Dreamweaver CC 2017，并学习对该软件的一些基本操作。 案例精讲019 Dreamweaver CC 2017 的安装 本例将讲解如何安装Dreamweaver CC 2017，具体操作方法如下。 案例文件：无 视频文件：视频教学Cha02Dreamweaver CC 2017 的安装与卸载.avi

D2章  Dreamweaver CC 2017的基本操作

本章重点

Dreamweaver CC 2017的安装

Dreamweaver CC 2017的卸载

Dreamweaver CC 2017的启动与退出

站点的建立

站点的管理

页面属性的设置

多媒体文件的添加

E- 链接

鼠标经过图像

出信息设置

设置空链接

Dreamweaver与其他设计类软件的基本操作方法不同，对于初学者来说，初次使用Dreamweaver会有许多困惑。为了方便后面章节的学习，在本章中将学习安装、卸载、启动Dreamweaver CC 2017，并学习对该软件的一些基本操作。

案例精讲019 Dreamweaver CC 2017 的安装

本例将讲解如何安装Dreamweaver CC 2017，具体操作方法如下。

案例文件：无

视频文件：视频教学Cha02Dreamweaver CC 2017 的安装与卸载.avi

（1） 将Dreamweaver CC 2017 的安装光盘放入光盘驱动器，系统会自动运行Dreamweaver CC2017 的安装程序。1先会出一个安装初始化界面，如图2-1 所示，初始化过程大约需要几分钟的时间。

（2） 此时会出Adobe Dreamweaver CC 2017 对话框，在下方设置其安装路径，安装过程需要创建一个文件夹，用来存放Dreamweaver CC 2017 安装的全部内容。如果用户希望将Dreamweaver CC2017 安装到默认的文件夹中，则直接单击【安装】按钮即可，如果想要更改安装路径，则可以单击安装位置右边的【更改】按钮，在磁盘列表中选择需要安装的磁盘，如图2-2 所示。

图2-1 初始化程序图2-2 设置安装路径

（3） 用户选择好安装的路径之后，单击【安装】按钮，开始安装Dreamweaver CC 2017 软件，如图2-3所示。

（4） Dreamweaver CC 2017 安装完成后，会显示【安装完成】界面，如图2-4 所示。

图2-3 安装进程图2-4 【安装完成】界面

（5）单击【关闭】按钮，完成Dreamweaver CC 2017 的安装。软件安装结束后，Dreamweaver CC2017 会自动在Windows 程序组中添加一个Dreamweaver CC 2017 的快捷方尸如图2-5 所示。

图2-5 添加Dreamweaver CC 2017 的快捷方式

案例精讲020 Dreamweaver CC 2017 的卸载

（1）若要卸载该软件，可以打开【控制面板】，选择“卸载程序”，进入【卸载或更改程序】界面，如图2-6 所示。

（2）选择Dreamweaver CC 2017 文件，右击，选择快捷菜单中的【卸载】命令，出【卸载选项】对话框，选中【删除shouxuan项】复选框，单击【卸载】按钮，如图2-7 所示。

图2-6 Dreamweaver CC 2017 的工作界面图2-7 【卸载选项】对话框

（3）然后开始卸载Dreamweaver CC 2017 软件，如图2-8 所示。

（4）卸载完成后，会出【卸载完成】对话框，这个时候单击【关闭】按钮即可，如图2-9 所示。

图2-8 卸载Dreamweaver CC 2017 软件图2-9 卸载完成

显示全部信息

目 录 D1 章 网页开发语言入门 案例精讲001 熟悉HTML 2 案例精讲002 HTML 的编写要求 3 案例精讲003 body 属性 4 案例精讲004 文字属性 5 案例精讲005 在网页中插入图像 6 案例精讲006 表格的使用 7 案例精讲007 表单的使用 8 案例精讲008 CJ链接的使用 11 案例精讲009 JavaScript 的基本信息 12 案例精讲010 JavaScript 的变量 13 案例精讲011 JavaScript 的运算符 13 案例精讲012 JavaScript 对事件作出反应 14

目 录

D1 章  网页开发语言入门

案例精讲001 熟悉HTML              2

案例精讲002 HTML 的编写要求           3

案例精讲003 body 属性              4

案例精讲004 文字属性              5

案例精讲005 在网页中插入图像          6

案例精讲006 表格的使用             7

案例精讲007 表单的使用             8

案例精讲008 CJ链接的使用          11

案例精讲009 JavaScript 的基本信息        12

案例精讲010 JavaScript 的变量          13

案例精讲011 JavaScript 的运算符         13

案例精讲012 JavaScript 对事件作出反应      14

案例精讲013 通过JavaScript 改变HTML 内容    14

案例精讲014 通过JavaScript 改变图像       15

案例精讲015 通过JavaScript 改变HTML 样式    16

案例精讲016 PHP 简介             17

案例精讲017 PHP 的常量与变量         18

案例精讲018 PHP 的运算符           18

D2 章  Dreamweaver CC 2017 的基本操作

案例精讲019 Dreamweaver CC 2017 的安装    22

案例精讲020 Dreamweaver CC 2017 的卸载    23

案例精讲021 Dreamweaver CC 2017 的启动与退出   24

案例精讲022 站点的建立            25

案例精讲023 站点的管理            26

案例精讲024 页面属性的设置          31

案例精讲025 多媒体文件的添加         37

案例精讲026 E- 链接            41

案例精讲027 鼠标经过图像           43

案例精讲028 出信息设置           44

案例精讲029 设置空链接            46

D3 章  休闲类网页的设计

案例精讲030 麦克疯音乐网页的设计       52

案例精讲031 速播电影网页的设计【视频案例】   61

案例精讲032 嘟嘟交友网页的设计【视频案例】   62

案例精讲033 媚图吧网页的设计【视频案例】    62

案例精讲034 下载吧网页的设计         63

案例精讲035 网络游戏网页的设计        73

案例精讲036 足球体育网页的设计        80

D4 章  电脑网络类网页的设计

案例精讲037 IT 信息wz            92

案例精讲038 技术wz【视频案例】       97

案例精讲039 人民信息港【视频案例】      98

案例精讲040 绿色软件wz           98

案例精讲041 设计wz             106

案例精讲042 速腾科技网页的设计【视频案例】            110

案例精讲043 个人博客wz           110

D5 章  商业经济类网页的设计

案例精讲044 申通物流网页           120

案例精讲045 恒洁卫浴网页           131

案例精讲046 宏泰投资网页【视频案例】     139

案例精讲047 凯莱顿酒店网页【视频案例】    139

案例精讲048 尼罗河汽车网页【视频案例】    140

案例精讲049 莱特易购网            141

案例精讲050 美食网              150

D6 章  教育培训类wz的设计

案例精讲051 天使宝贝（一）          164

案例精讲052 天使宝贝（二）【视频案例】    183

案例精讲053 天使宝贝（三）【视频案例】    183

案例精讲054 小学wz网页的设计        184

案例精讲055 兴德教师招聘网【视频案例】    196

案例精讲056 新起点图书馆【视频案例】     197

D7 章  艺术爱好类wz的设计

案例精讲057 酷图网网页的设计         200

案例精讲058 书画网网页的设计         210

案例精讲059 唐人戏曲网页的设计【视频案例】  217

案例精讲060 婚纱摄影网页的设计【视频案例】  218

案例精讲061 家居wz的设计          219

案例精讲062 工艺品wz的设计【视频案例】   225

D8 章  旅游交通类wz的设计

案例精讲063 驰飞网网页的设计         228

案例精讲064 天气预报网网页的设计       248

案例精讲065 黑蚂蚁欢乐谷网页的设计（一）【视频案例】            262

案例精讲066 黑蚂蚁欢乐谷网页的设计（二）【视频案例】            263

案例精讲067 旅游wz（一）          263

案例精讲068 旅游wz（二）          288

案例精讲069 旅游wz（三）          300

D9 章  生活服务类wz的设计

案例精讲070 礼品网wz            312

案例精讲071 鲜花网wz（一）         331

案例精讲072 鲜花网wz（二）         343

案例精讲073 装饰公司wz（一）        350

案例精讲074 装饰公司wz（二）        360

案例精讲075 装饰公司wz（三）        372

显示全部信息

《Dreamweaver CC 网页创意设计案例课堂(D2版)》以75 个精彩实例向读者详细介绍了Dreamweaver CC 2017 强大的网页制作功能。《Dreamweaver CC 网页创意设计案例课堂(D2版)》注重理论与实践紧密结合，实用性和可操作性强，相对于同类Dreamweaver CC 2017 实例书籍，本书具有以下特色：

（1） 信息量大。75 个实例为每一位读者架起一座快速掌握Dreamweaver CC 使用与操作的“桥梁”；75 种设计理念令每一个从事网页设计的专业人士在工作中灵感迸发；75 种艺术效果和制作方法使每一位初学者融会贯通、举一反三。

（2） 实用性强。75 个实例经过精心设计、选择，不仅效果精美，而且FC实用。

（3） 注重方法的讲解与技巧的总结。本书特别注重对各实例制作方法的讲解与技巧总结，在介绍具体实例制作的详细操作步骤的同时，对于一些重要而常用的实例制作方法和操作技巧做了较为精辟的总结。

（4） 操作步骤详细。本书中各实例的操作步骤介绍FC详细，即使是初级入门的读者，只需一步一步按照本书中介绍的步骤进行操作，一定能做出相同的效果。

（5） 适用广泛。本书实用性和可操作性强，适合广大网页设计爱好者使用，也可以作为职业学校和计算机学校相关专业的教材。

（6）海量的学习资源和素材

《Dreamweaver CC 网页创意设计案例课堂(D2版)》附带一张DVD 教学光盘，内容包括本书所有素材文件、场景文件、效果文件、多媒体有声视频教学录像，读者在读完本书内容以后，可以调用这些资源进行深入练习。

 

D2章 Dreamweaver CC 2017的基本操作 本章重点 Dreamweaver CC 2017的安装 Dreamweaver CC 2017的卸载 Dreamweaver CC 2017的启动与退出 站点的建立 站点的管理 页面属性的设置 多媒体文件的添加 E- 链接 鼠标经过图像 出信息设置 设置空链接 Dreamweaver与其他设计类软件的基本操作方法不同，对于初学者来说，初次使用Dreamweaver会有许多困惑。为了方便后面章节的学习，在本章中将学习安装、卸载、启动Dreamweaver CC 2017，并学习对该软件的一些基本操作。 案例精讲019 Dreamweaver CC 2017 的安装 本例将讲解如何安装Dreamweaver CC 2017，具体操作方法如下。 案例文件：无 视频文件：视频教学Cha02Dreamweaver CC 2017 的安装与卸载.avi

D2章  Dreamweaver CC 2017的基本操作

本章重点

Dreamweaver CC 2017的安装

Dreamweaver CC 2017的卸载

Dreamweaver CC 2017的启动与退出

站点的建立

站点的管理

页面属性的设置

多媒体文件的添加

E- 链接

鼠标经过图像

出信息设置

设置空链接

Dreamweaver与其他设计类软件的基本操作方法不同，对于初学者来说，初次使用Dreamweaver会有许多困惑。为了方便后面章节的学习，在本章中将学习安装、卸载、启动Dreamweaver CC 2017，并学习对该软件的一些基本操作。

案例精讲019 Dreamweaver CC 2017 的安装

本例将讲解如何安装Dreamweaver CC 2017，具体操作方法如下。

案例文件：无

视频文件：视频教学Cha02Dreamweaver CC 2017 的安装与卸载.avi

（1） 将Dreamweaver CC 2017 的安装光盘放入光盘驱动器，系统会自动运行Dreamweaver CC2017 的安装程序。1先会出一个安装初始化界面，如图2-1 所示，初始化过程大约需要几分钟的时间。

（2） 此时会出Adobe Dreamweaver CC 2017 对话框，在下方设置其安装路径，安装过程需要创建一个文件夹，用来存放Dreamweaver CC 2017 安装的全部内容。如果用户希望将Dreamweaver CC2017 安装到默认的文件夹中，则直接单击【安装】按钮即可，如果想要更改安装路径，则可以单击安装位置右边的【更改】按钮，在磁盘列表中选择需要安装的磁盘，如图2-2 所示。

图2-1 初始化程序图2-2 设置安装路径

（3） 用户选择好安装的路径之后，单击【安装】按钮，开始安装Dreamweaver CC 2017 软件，如图2-3所示。

（4） Dreamweaver CC 2017 安装完成后，会显示【安装完成】界面，如图2-4 所示。

图2-3 安装进程图2-4 【安装完成】界面

（5）单击【关闭】按钮，完成Dreamweaver CC 2017 的安装。软件安装结束后，Dreamweaver CC2017 会自动在Windows 程序组中添加一个Dreamweaver CC 2017 的快捷方尸如图2-5 所示。

图2-5 添加Dreamweaver CC 2017 的快捷方式

案例精讲020 Dreamweaver CC 2017 的卸载

（1）若要卸载该软件，可以打开【控制面板】，选择“卸载程序”，进入【卸载或更改程序】界面，如图2-6 所示。

（2）选择Dreamweaver CC 2017 文件，右击，选择快捷菜单中的【卸载】命令，出【卸载选项】对话框，选中【删除SX项】复选框，单击【卸载】按钮，如图2-7 所示。

图2-6 Dreamweaver CC 2017 的工作界面图2-7 【卸载选项】对话框

（3）然后开始卸载Dreamweaver CC 2017 软件，如图2-8 所示。

（4）卸载完成后，会出【卸载完成】对话框，这个时候单击【关闭】按钮即可，如图2-9 所示。

图2-8 卸载Dreamweaver CC 2017 软件图2-9 卸载完成

显示全部信息