Dreamweaver CC网页创意设计案例课堂(附光盘)

Dreamweaver CC网页创意设计案例课堂(附光盘) pdf epub mobi txt 电子书 下载 2025

刘涛 等 著
图书标签:
  • Dreamweaver CC
  • 网页设计
  • 创意设计
  • 案例教程
  • 前端开发
  • HTML
  • CSS
  • JavaScript
  • 网页制作
  • 光盘
想要找书就要到 静流书站
立刻按 ctrl+D收藏本页
你会得到大惊喜!!
出版社: 清华大学出版社
ISBN:9787302386124
版次:1
商品编码:11623549
品牌:清华大学
包装:平装
丛书名: CG设计案例课堂
开本:16开
出版时间:2015-01-01
用纸:胶版纸
页数:488
正文语种:中文

具体描述

编辑推荐

  清华大学出版社“案例课堂”大系
  丛书以案例的形式讲解软件的内容,读者可以在实践中熟练掌握软件的使用方法。
  每一个案例都精挑细选,同时配有全程语音讲解的视频文件,方便读者学习。
  案例的选材广泛,涉及到软件应用的各个领域、各个行业,学习无死角。
  “CG设计”系列全彩精印,同等价位下内容更多,同等内容下更实惠。
  “网站开发”系列附赠超值,全面学习无障碍:
  CSS属性速查表
  HTML标签速查表
  网页布局案例赏析
  精彩网站配色方案赏析
  精选JavaScript实例
  JavaScript函数速查手册
  CSS+DIV布局案例赏析
  案例源文件与教学课件


内容简介

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

目录

第1章 Dreamweaver CC的基本操作

案例精讲001 Dreamweaver CC的安装 2

案例精讲002 Dreamweaver CC的启动与退出 4

案例精讲003 站点的建立 5

案例精讲004 站点的管理 6

案例精讲005 页面属性设置 8

案例精讲006 多媒体文件的添加 9

案例精讲007 E-mail链接 12

案例精讲008 下载链接 14

案例精讲009 鼠标经过图像 15

案例精讲010 弹出信息设置 16

案例精讲011 设置空链接 18


第2章 娱乐休闲类网页设计

案例精讲012 金属音乐网页设计 20

案例精讲013 速播电影网页设计 28

案例精讲014 嘟嘟交友网页设计 35

案例精讲015 媚图吧网页设计 45

案例精讲016 网络游戏网页设计 53

案例精讲017 篮球体育网页设计 59

案例精讲018 下载吧网页设计 67


第3章 电脑网络类网页设计

案例精讲019 IT信息网站 78

案例精讲020 技术网站 83

案例精讲021 个人博客网站 88

案例精讲022 设计网站 96

案例精讲023 绿色软件网站 99

案例精讲024 人民信息港 105

案例精讲025 速腾科技网页设计 113


第4章 商业经济类网页设计

案例精讲026 宏达物流网页 122

案例精讲027 洁雅卫浴网页 129

案例精讲028 宏泰投资网页 135

案例精讲029 凯莱顿酒店网页 142

案例精讲030 尼罗河汽车网页 150

案例精讲031 莱特易购网 158

案例精讲032 美食网 165


第5章 教育培训类网站设计

案例精讲033 小学网站网页设计 172

案例精讲034 天使宝贝(一) 181

案例精讲035 天使宝贝(二) 195

案例精讲036 天使宝贝(三) 203

案例精讲037 兴德教师招聘网 207

案例精讲038 新起点图书馆 215


第6章 艺术爱好类网站设计

案例精讲039 万图网网页设计 224

案例精讲040 书画网网页设计 232

案例精讲041 唐人戏曲网页设计 239

案例精讲042 婚纱摄影网页设计 250

案例精讲043 家居网站设计 255

案例精讲044 工艺品网设计 261


第7章 旅游交通类网站设计

案例精讲045 路畅网网页设计 268

案例精讲046 天气预报网网页设计 285

案例精讲047 黑蚂蚁欢乐谷网页设计(一) 299

案例精讲048 黑蚂蚁欢乐谷网页设计(二) 309

案例精讲049 旅游网站(一) 319

案例精讲050 旅游网站(二) 341

案例精讲051 旅游网站(三) 349


第8章 生活服务类网站设计

案例精讲052 礼品网网站 358

案例精讲053 鲜花网网站(一) 373

案例精讲054 鲜花网网站(二) 385

案例精讲055 房地产网站 391

案例精讲056 装饰公司网站(一) 398

案例精讲057 装饰公司网站(二) 406

案例精讲058 装饰公司网站(三) 416


第9章 购物网站设计

案例精讲059 shoes社区(一) 422

案例精讲060 shoes社区(二) 426

案例精讲061 shoes社区(三) 433

案例精讲062 女人天女装(一) 440

案例精讲063 女人天女装(二) 452

案例精讲064 女人天女装(三) 457

案例精讲065 魅包网 466

精彩书摘

  第1章 Dreamweaver CC的基本操作

  ◆ Dreamweaver CC的安装

  ◆ Dreamweaver CC的启动与退出

  ◆ 站点的建立

  ◆ 站点的管理

  ◆ 页面属性设置

  ◆ 多媒体文件的添加

  ◆ E-mail链接

  ◆ 下载链接

  ◆ 鼠标经过图像

  ◆ 弹出信息设置

  ◆ 设置空链接

  本章重点

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

  案例精讲001 Dreamweaver CC的安装

  案例文件:无视频文件:视频教学 Cha01 Dreamweaver CC的安装.avi

  制作概述

  本例将讲解如何安装Dreamweaver CC。

  学习目标

  掌握Dreamweaver CC的安装方法。

  操作步骤

  (1) 将Dreamweaver CC的安装光盘放入光盘驱动器,系统会自动运行Dreamweaver CC的安装程序。首先屏幕中会弹出一个安装初始化,如图1-1所示,这个过程大约需要几分钟的时间。

  (2) Dreamweaver CC的安装程序会自动弹出一个欢迎安装界面,单击【安装】或【试用】按钮,如图1-2所示。

  图1-1 初始化程序

  图1-2 欢迎安装界面

  (3) 随后弹出Dreamweaver CC授权协议窗口,单击Dreamweaver CC授权协议窗口右下角的【接受】按钮,如图1-3所示。

  (4) 在弹出的对话框中的序列号文本框中填入序列号进行安装,然后单击【下一步】按钮,如图1-4所示。

  图1-3 接受软件许可协议

  图1-4 输入序列号

  (5) 此时会弹出Dreamweaver CC的安装路径,安装过程需要创建一个文件夹,用来存放Dreamweaver CC安装的全部内容。如果用户希望将Dreamweaver CC安装到默认的文件夹中,则直接单击【安装】按钮即可;如果想要更改安装路径,则可以单击安装位置右边的【更改】按钮,在磁盘列表中选择相应的磁盘,如图1-5所示。

  (6) 用户选择好安装的路径之后,单击【安装】按钮,开始安装Dreamweaver CC软件,如图1-6所示。

  图1-5 安装路径

  图1-6 安装进程

  (7) Dreamweaver CC安装完成后,会显示一个安装完成窗口,如图1-7所示。

  (8) 单击【关闭】按钮,完成Dreamweaver CC的安装。软件安装结束后,Dreamweaver CC会自动在Windows程序组中添加一个Dreamweaver CC的快捷方式,如图1-8所示。

  图1-7 安装完成界面

  图1-8 Dreamweaver CC快捷方式

  案例精讲002 Dreamweaver CC的启动与退出

  案例文件:无视频文件:视频教学 Cha01 Dreamweaver CC的启动与退出.avi

  制作概述

  本例介绍如何启动与退出Dreamweaver CC。

  学习目标

  掌握启动与退出Dreamweaver CC的方法。

  操作步骤

  (1) 双击桌面上的Dreamweaver CC快捷方式,进入Dreamweaver CC的工作界面,如图1-9所示,程序就启动完成了。

  (2) 退出程序可以单击Dreamweaver CC工作界面右上角的按钮关闭程序,也可以选择菜单栏中的【文件】|【退出】命令退出程序,如图1-10所示。

  知识链接Adobe Dreamweaver,简称DW,中文名称为“梦想编织者”,是美国Macromedia公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器。Adobe Dreamweaver使用所见即所得的接口,亦有HTML(标准通用标记语言下的一个应用)编辑的功能。DW是第一套针对专业网页设计师的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和浏览器限制的充满动感的网页。目前有Mac版本和Windows版本。

  图1-9 Dreamweaver CC的工作界面

  图1-10 选择【退出】命令

  案例精讲003 站点的建立

  案例文件:无视频文件:视频教学 Cha01 站点的建立.avi

  制作概述

  在制作网页之前,需要建立站点。本例介绍如何使用Dreamweaver CC建立站点。

  学习目标

  学会如何建立站点。

  操作步骤

  (1) 启动Dreamweaver CC软件,选择【站点】|【新建站点】菜单命令,如图1-11所示。

  (2) 弹出【站点设置对象】对话框,在【站点名称】文本框中输入“我爱我家”,如图1-12所示。

  图1-11 选择【新建站点】命令

  图1-12 保存文件

  (3) 在【本地站点文件夹】文本框中指定站点的位置,即计算机上用于存储站点文件的本地文件夹。可以单击该文本框右侧的文件夹图标以浏览相应的文件夹,如图1-13所示。

  (4) 单击【保存】按钮,关闭【站点设置对象】对话框,在【文件】面板中的【本地文件】窗口中会显示该站点的根目录,如图1-14所示。

  图1-13 存储面板

  图1-14 【文件】面板

  知识链接Dreamweaver站点是一种管理网站中所有相关联文档的工具,通过站点可以实现将文件上传到网络服务器、自动跟踪和维护、管理文件以及共享文件等功能。严格地说,站点也是一种文档的组织形式,由文档和文档所在的文件夹组成,不同的文件夹保存不同的网页内容,如images文件夹用于存放图片,这样便于以后管理与更新。Dreamweaver中的站点包括本地站点、远程站点和测试站点3类。本地站点是用来存放整个网站框架的本地文件夹,是用户的工作目录,一般制作网页时只需建立本地站点。远程站点是存储于Internet服务器上的站点和相关文档。通常情况下,为了不连接Internet而对所建的站点进行测试,可以在本地计算机上创建远程站点,来模拟真实的Web服务器进行测试。

  案例精讲004 站点的管理

  案例文件:无视频文件:视频教学 Cha01 站点的管理.avi

  制作概述

  本例介绍如何在Dreamweaver CC中管理站点。

  学习目标

  掌握使用Dreamweaver CC管理站点的方法。

  操作步骤

  (1)选择【站点】|【管理站点】菜单命令,如图1-15所示。

  (2)打开【管理站点】对话框,如图1-16所示。

  图1-15 选择【管理站点】命令

  图1-16 【管理站点】对话框

  (3)在【管理站点】对话框中选择要打开的站点,如选择【我爱我家】站点,单击【完成】按钮,即可将其打开,如图1-17所示。

  知识链接测试站点是Dreamweaver处理动态页面的文件夹,使用此文件夹生成动态内容并在工作时连接到数据库,用于对动态页面进行测试。静态网页是标准的HTML文件,采用HTML编写,是通过HTTP在服务器端和客户端之间传输的纯文本文件,其扩展名是htm或html。动态网页以.asp、jsp、php等形式为后缀,以数据库技术为基础,含有程序代码,是可以实现如用户注册、在线调查、订单管理等功能的网页文件。动态网页能根据不同的时间、不同的来访者显示不同的内容,动态网站更新方便,一般在后台直接更新。

  (4)如果要对站点进行编辑,可在选择站点名称后单击【编辑当前选定的站点】按钮,如图1-18所示,完成上述操作后即可打开【站点设置对象】对话框。

  图1-17 选择对象

  图1-18 单击【编辑当前选定的站点】按钮

  (5)完成编辑后,单击【保存】按钮,返回【管理站点】对话框,单击【完成】按钮结束站点的编辑,如图1-19所示。

  图1-19 保存文件

  知识链接站点是一组具有共享属性(如相关主题、类似的设计或共同目的)的链接文档和资源。Dreamweaver是创建和管理站点的工具,使用它不仅可以创建单独的文档,还可以创建完整的Web站点。

  案例精讲005 页面属性设置

  案例文件:无视频文件:视频教学 Cha01 页面属性设置.avi

  制作概述

  本例介绍Dreamweaver CC的页面属性设置。

  学习目标

  学会如何设置网页的页面属性。

  操作步骤

  (1) 运行Dreamweaver CC软件,单击【属性】栏中的【页面属性】按钮,如图1-20所示。

  (2) 在弹出的【页面属性】对话框中的【分类】栏中进行选择,可对页面的背景颜色、位图和字体等进行设置,如图1-21所示。

  对于在Dreamweaver中创建的每个页面,都可以使用【页面属性】对话框指定布局和格式设置属性。在【页面属性】对话框可以指定页面的默认字体系列和字体大小、背景颜色、边距、链接样式及页面设计的其他许多方面。可以为创建的每个新页面指定新的页面属性,也可以修改现有页面的属性。在【页面属性】对话框中所进行的更改将应用于整个页面。Dreamweaver提供了两种修改页面属性的方法:CSS 或 HTML。Adobe建议使用CSS设置背景和修改页面属性。

  图1-20 单击【页面属性】按钮

  图1-21 设置参数

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

  案例文件:无视频文件:视频教学 Cha01 多媒体文件的添加.avi

  制作概述

  本例介绍如何在网页中添加多媒体文件。

  学习目标

  学会如何在网页中添加多媒体文件。

  操作步骤

  (1) 启动Dreamweaver CC,在欢迎屏幕的【新建】栏中选择HTML选项,如图1-22所示。

  (2) 选择菜单栏中的【插入】|【媒体】| flash SWF命令,将随书附带光盘中的CDROM 素材 Cha01自行车.swf文件插入到当前文档,如图1-23所示。

  图1-22 选择HTML选项

  图1-23 选择对象

  (3) 单击【确定】按钮后会弹出请求保存对话框,单击【是】按钮,如图1-24所示。

  (4) 在【对象标签辅助功能属性】对话框中,标题随意即可,单击【确定】按钮即可,如图1-25所示。

  图1-24 单击【是】按钮

  图1-25 【对象标签辅助功能属性】

  (5) 完成上述操作,效果如图1-26所示。

  (6) 完成后进行保存,按F12键可以在浏览器中预览效果,如图1-27所示。

  图1-26 完成操作后的效果

  图1-27 预览效果

  知识链接相比传统媒体,网页包含了更多的组成元素——除了文字、图像、音频、视频外,还有很多其他对象也可以加入网页中,比如Java Applet小程序、Flash动画、QuickTime电影等。1. 文字文字是网页的主体,是传达信息最重要的方式。因为它占用的存储空间非常小(一个汉字只占用两个字节),所以很多大型的网站提供纯文字的版面以缩短浏览者的下载时间。文字在网页上的主要形式有标题、正文、文本链接等。2. 图像采用图像可以减少纯文字给人的枯燥感,巧妙的图像组合可以带给用户美的享受。图像在网页中有很多用途,可以用来做图标、标题、背景等,甚至构成整个页面。(1)图标网站的标志是风格和主题的集中体现,其中可以包含文字、符号、图案等元素。设计师就是用这些元素进行巧妙组合来达到表现公司、网站形象的目的。(2)标题标题可以用文本,也可以用图像。但是使用图像标题要比文本标题的表现力更强,效果更加突出。有时页面中的标题需要使用特殊的字体,但可能很多浏览者的机器上没有安装这种字体,那么浏览者看到的效果和设计师看到的效果是不同的。此时最好的解决方法就是将标题文字制作成图片,这样可以保证所有人看到的效果是一样的。

  (3)插图通过照片和插图可以直观地表达效果和展现主题,但也有一些插图仅仅是为了装饰。广告条网络媒体和其他传统媒体一样,投放广告是获取商业利益的重要手段。网站中的广告通常有两种形式:一是文字链接广告;二是广告条。前者通过HTML语言即可实现,后者是把广告内容设计为吸引浏览者注意的图像或者动画,让浏览者通过单击来访问特定的宣传网页。(4)背景使用背景是网站整体设计风格的重要方法之一。背景可通过HTML语言定义为单色或背景图像,背景图像可以是JPEG和GIF两种格式。(5)导航栏导航栏用来帮助浏览者熟悉网站结构,让浏览者可以很方便地访问想要的页面。导航栏的风格需要和页面保持一致。导航栏主要有文字导航和图形导航两种形式。文字式导航清楚易懂,下载迅速,适用于信息量大的网站。图形导航栏美观,表现力强,适用于一般商业网站或个人网站。3. 音频将多媒体引入网页,可以在很大程度上吸引浏览者的注意。利用多媒体文件可以制作出更有创造性、艺术性的作品,它的引入使网站成了一个有声有色、动静相宜的世界。多媒体一般指音频、视频、动画等形式。网上常见的音频格式有MIDI、WAV、MP3等。MIDI音乐:每逢节日,我们都会到贺卡网站上收发电子贺卡。其中有些贺卡就有一种音色类似电子琴的背景音乐,这种背景音乐就是网上常见的一种多媒体格式——MIDI音乐,它的文件以.mid为扩展名,特点是文件体积非常小,很快就可下载完毕,但音色很单调。WAV音频:我们每次打开计算机时听到的进入系统的音乐实际上就是WAV音频。该音频是以.wav为扩展名的声音文件,它的特点是表现力丰富,但文件体积很大。【MP3音乐】:MP3是我们非常熟悉的文件格式,现在互联网上的音乐大多数都是MP3格式的,它的特点是在尽可能保证音质的情况下减小文件体积,通常长度为3min左右的歌曲文件,大概在3MB。4. 视频视频在网页上出现得不多,但它有着其他媒体不可替代的优势。视频传达的信息形象生动,能给人留下深刻的印象。常见的网上视频文件有AVI、RM等。AVI视频:AVI视频文件是由Microsoft开发的视频文件格式,其文件的扩展名为.avi。它的特点是视频文件不失真,视觉效果很好,但缺点是文件体积太大,短短几分钟的视频文件需要耗费几百兆的硬盘空间。RM视频:喜欢在线看电影的朋友一定认识它,它是由Real Networks公司开发的音视频文件格式,主要用于网上的电影文件传输,扩展名为.rm。它的特点是能一边下载一边播放,又称为流式媒体。QuickTime电影:QuickTime电影是由美国苹果计算机公司开发的用于Mac OS的一种电影文件格式,在PC上也可以使用,但需要安装QuickTime的插件,这种媒体文件的扩展名是.mov。WMV视频:这是微软公司开发的新一代视频文件格式,特点是文件体积小而且视频效果较好,能够支持边下载边播放,目前已经在网上电影市场中站稳了脚跟。FLV视频:FLV是 Flash Video的简称。FLV串流媒体格式是一种新的网络视频格式,它的

  出现有效地解决了视频文件导入Flash后,使导出的SWF文件体积庞大,不能在网络上有效使用等缺点。随着网络视频网站的丰富,该格式已经非常普及。5. 动画动画是网页中最吸引眼球的地方,好的动画能够使页面显得活泼生动,达到动静相宜的效果。特别是Flash动画产生以来,动画成了网页设计中最热门的话题。常见的动画格式:GIF动画是多媒体网页动画最早的动画格式,优点是文件体积小,但没有交互性,主要用于网站图标和广告条。Flash动画:Flash动画是基于矢量图形的交互性流式动画文件格式,可以用Adobe开发的Flash CS3进行制作。使用其内置的ActionScript语言还可以创建出各种复杂的应用程序,甚至是各种游戏。Java Applet:在网页中可以调用Java Applet来实现一些动画效果。6.链接和路径当用鼠标单击网页上的一段文本(或一张图片)时,此时会出现小手的形状,如果可以打开网络上一个新的地址,就代表该文本(或图片)上有链接。

  案例精讲007 E-mail链接

  案例文件:无视频文件:视频教学 Cha01 E-mail链接.avi

  制作概述

  本例介绍如何在网页中添加E-mail链接。

  学习目标

  学会如何在网页中添加E-mail链接。

  操作步骤

  (1) 运行Dreamweaver CC,在欢迎屏幕的【新建】栏中选择HTML选项,然后输入“有空联系,可以给我发邮件”文本,如图1-28所示。

  (2) 选中其中的【邮件】文本,如图1-29所示。

  图1-28 新建文件

  图1-29 选中文本

  (3) 选择菜单栏中的【插入】|【电子邮件链接】命令,在弹出的【电子邮件链接】对话框中的【电子邮件】文本框中输入电子邮件地址dlwcno111@163.com,然后单击【确定】按钮,即可为选择的文本添加电子邮件链接,如图1-30所示。

  (4) 电子邮件链接完成后,保存文件。按F12键可以在浏览器中预览效果,如图1-31所示。

  图1-30 添加电子邮件链接

  图1-31 预览效果

  知识链接电子邮件(标志:@,也被大家昵称为“伊妹儿”),是一种用电子手段提供信息交换的通信方式,是互联网应用最广的服务。通过网络的电子邮件系统,用户可以以非常低廉的价格(不管发送到哪里,都只需负担网费)、非常快速的方式(几秒之内可以发送到世界上任何指定的目的地),与世界上任何一个角落的网络用户联系。电子邮件可以是文字、图像、声音等多种形式。同时,用户可以得到大量免费的新闻、专题邮件,并实现轻松的信息搜索。电子邮件的存在极大地方便了人与人之间的沟通与交流,促进了社会的发展。超级链接是网页中最重要、最基本的元素之一。每个网站实际上都是由很多网页组成的,这些网页都是通过超级链接的形式关联在一起的。超级链接的作用是在因特网上建立一个位置到另一个位置的链接。超级链接由源地址文件和目标地址文件构成,当访问者单击超级链接时,浏览器会自动从相应的目的网址检索网页并显示在浏览器中。如果目标地址不是在网页而是其他类型的文件,浏览器会自动调用本机上的相关程序打开所要访问的文件。在网页中的链接按照链接路径的不同可分为3种形式:绝对路径、相对路径和根目录路径。这些路径都是网页中的统一资源定位,只不过后两种路径将URL的通信协议和主机名省略了,但必须有参照物,一种是以文档为参照物,另一种是以站点的根目录为参照物,而第一种就不需要有参照物,它是最完整的路径,也是标准的URL。

  案例精讲008 下载链接

  案例文件:无视频文件:视频教学 Cha01下载链接.avi

  制作概述

  本例介绍如何在网页中添加下载链接。

  学习目标

  学会如何在网页中添加下载链接。

  操作步骤

  (1) 运行Dreamweaver CC,打开随书附带光盘中的CDROM素材Cha01会议室.html网页文件,选择网页中的【会议室】文本,如图1-32所示。

  (2) 在【属性】面板中单击【链接】后的【浏览文件】按钮,在打开的【选择文件】对话框中选择“会议室.zip”文件,单击【确定】按钮,如图1-33所示。

  图1-32 打开文件

  图1-33 【选择文件】对话框

  (3) 指定路径完成后,在【属性】面板中可查看到所选择的链接文件,如图1-34所示。

  (4) 下载文件链接完成后,保存文件。按F12键可以在浏览器中预览效果,如图1-35所示。

  图1-34 【属性】面板

  图1-35 预览效果

  案例精讲009 鼠标经过图像

  案例文件:无视频文件:视频教学 Cha01 鼠标经过图像.avi

  制作概述

  本例介绍如何在网页中添加鼠标经过图像的效果。

  学习目标

  学会如何在网页中添加鼠标经过图像的效果。

  操作步骤

  (1) 启动Dreamweaver CC,在欢迎屏幕中的【新建】栏中选择HTML选项,如图1-36所示。

  (2) 选择菜单栏中的【插入】|【图像】|【鼠标经过图像】命令,如图1-37所示。

  图1-36 新建文件

  图1-37 选择【鼠标经过图像】命令

  (3)弹出【鼠标经过图像】对话框,单击【原始图像】文本框右侧的【浏览】按钮,在弹出的【原始图像】对话框中选择鼠标经过前的图像文件“匣释者.jpg”,如图1-38所示。

  (4)单击【鼠标经过图像】文本框右侧的【浏览】按钮,在弹出的原始图像对话框中选择鼠标经过时的图像文件“萨菲罗斯.jpg”,如图1-39所示。

  图1-38 选择经过前的图像

  图1-39 选择经过时的图像

  (5) 完成后单击【确定】按钮,然后单击菜单栏中的【实时视图】按钮,预览效果,最后保存,如图1-40所示。

  图1-40 单击【确定】按钮

  ……

前言/序言

  随着网站技术的进一步发展,各个部门对网站开发技术的要求也日益提高。纵观人才市场,各企事业单位对网站开发工作人员的需求也大大增加。网站建设是一项综合性的技能,对很多计算机技术都有着较高的要求,而Dreamweaver是集创建网站和管理网站于一身的专业性网页编辑工具,因其界面友好、人性化和易于操作而被很多网页设计者所欣赏。

  本书以65个精彩实例向读者详细介绍Dreamweaver CC强大的网页制作功能。本书注重理论与实践紧密结合,实用性和可操作性强。本书具有以下特色:

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

  ● 实用性强:65个实例经过精心设计、选择,不仅效果精美,而且非常实用。

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

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

  ● 适用广泛:本书实用性和可操作性强,适用于广大网页设计爱好者,也可以作为职业学校和计算机学校相关专业的教材。

  本书主要由唐琳、李晓龙、韩宜波、刁海龙、李少勇、段晖、刘希望、赵锴、张波、郁陶、刘彬、徐慧、和张树涛编写,李鹏、刘进、刘斌录制多媒体教学视频,其他参与编写的还有杨月、张朋、刘志富、宫如峰,谢谢你们在书稿前期材料的组织、版式设计、校对、编排以及大量图片的处理等方面所做的工作。

  本书总结了作者从事多年影视编辑的实践经验,目的是帮助想从事影视制作行业的广大读者迅速入门并提高学习和工作效率,同时对有一定视频编辑经验的朋友也有很好的参考作用。由于时间仓促,疏漏之处在所难免,恳请读者和专家指教。如果您对书中的某些技术问题持有不同的意见。

  作 者


开启你的网页创意设计之旅:从灵感萌芽到实践绽放 在这个数字信息爆炸的时代,一个引人入胜、功能齐全的网站不再仅仅是信息的载体,更是品牌形象的窗口、用户体验的战场,以及创意表达的平台。然而,从一个模糊的创意到最终呈现在屏幕上的精彩网页,这条路径充满了挑战与机遇。本书《Dreamweaver CC网页创意设计案例课堂》正是为你量身打造的指南,它将带领你深入探索网页设计的核心理念、掌握前沿的设计技巧,并最终将你的创意构想变为触手可及的现实。 本书不仅仅是一本枯燥的技术手册,更是一次启发你设计思维、提升实战能力的深度学习体验。我们深知,优秀的网页设计并非源于对工具的机械操作,而是始于对用户需求的深刻理解、对美学原则的精准把握,以及对技术实现的巧妙运用。因此,我们将以“创意”为核心,以“案例”为载体,以“实战”为目标,为你构建一个全面、系统、富有启发性的学习体系。 内容革新:不止于技术,更在于创意的拔升 本书最大的亮点在于其对“创意”的深度挖掘与系统呈现。我们不会仅仅停留在讲解Dreamweaver CC软件的各项功能,而是将重心放在如何通过这些功能来 实现和优化你的网页创意。 创意萌芽与用户洞察: 我们将首先引导你认识网页设计的起点——创意。这包括如何从市场趋势、用户痛点、竞品分析中捕捉灵感,如何将抽象的创意概念转化为具体的网页功能和视觉元素。你将学习到用户画像的构建、用户旅程的梳理等方法,从而确保你的设计能够真正打动目标用户。 视觉传达与美学原则: 网页的视觉呈现是用户的第一印象。本书将深入剖析色彩搭配、字体选择、布局结构、留白运用、图像处理等关键视觉元素,并结合大量优秀网站案例,讲解如何将这些元素有机地组织起来,形成和谐、美观且富有表现力的界面。我们还将探讨当下流行的设计风格,如扁平化、微拟物、卡片式设计等,并分析其背后的设计理念。 交互设计与用户体验: 一个优秀的网站不仅要好看,更要好用。本书将重点讲解如何通过合理的交互设计来提升用户体验。你将学习到按钮设计、导航结构、表单设计、动效运用等方面的技巧,以及如何通过用户测试来不断优化你的设计。我们还将触及响应式设计的重要性,确保你的网站能够在不同设备上呈现最佳效果。 内容策略与信息架构: 网页的核心是内容。本书将指导你如何进行有效的内容组织和呈现。你将学习到信息架构的设计原则,如何将复杂的信息进行层级划分和逻辑梳理,以及如何通过图文结合、多媒体运用等方式,让内容更易于用户理解和消化。 案例为引:理论与实践的完美结合 本书最大的特色之一,便是贯穿始终的 真实、丰富的案例分析。我们精选了来自不同行业、不同风格的优秀网页设计案例,从电商网站、企业官网、个人博客到创意作品集,涵盖了广泛的应用场景。 案例深度剖析: 对于每一个案例,我们都将进行深入细致的剖析,不仅仅是展示最终的成品,更会追溯其设计的思路、技术实现的难点、以及最终达成的商业目标。你将看到设计师是如何从零开始,逐步构建出这些精彩网站的。 问题导向的学习: 我们将通过模拟真实项目中的常见问题,引导你思考解决方案。例如,当遇到“如何让用户更愿意填写表单”时,我们会结合案例分析,讲解在Dreamweaver CC中如何通过优化表单设计和交互流程来解决这个问题。 模仿与创新: 在学习案例的过程中,我们鼓励你进行模仿和再创作。通过理解优秀设计的精髓,并结合自己的创意,你将能够快速提升自己的设计能力,并逐渐形成独特的个人风格。 案例类型多样化: 无论是需要展示品牌形象的企业官网,还是强调产品销售的电商平台,亦或是突出个人才华的作品集网站,本书都将为你提供相应的案例指导,让你能够应对不同类型的项目需求。 Dreamweaver CC的应用:创意实现的利器 作为一款功能强大的网页设计与开发工具,Dreamweaver CC在本书中扮演着至关重要的角色。我们将 “以创意为导向,以Dreamweaver CC为工具”,教你如何高效地运用其各项功能来实现你的设计构想。 可视化设计与代码编辑的融合: 你将学习到如何在Dreamweaver CC的可视化界面中进行元素的布局、样式的调整,同时也能深入代码编辑器,理解和优化CSS、HTML等网页语言。这种“所见即所得”与“代码控制”的结合,将极大地提升你的设计效率和灵活性。 响应式设计助手: 针对当前多设备访问的需求,本书将重点讲解Dreamweaver CC在响应式设计方面的强大支持,包括使用流体网格、媒体查询等功能,让你能够轻松创建适应不同屏幕尺寸的网页。 组件与库的运用: Dreamweaver CC提供了丰富的组件和库,例如预设的导航菜单、表单元素等,本书将指导你如何高效地利用这些资源,快速搭建网页骨架,并将精力更多地投入到创意和细节的打磨上。 与Adobe其他软件的协同: 在现代网页设计流程中,与Photoshop、Illustrator等设计软件的协同工作是必不可少的。本书将为你演示如何将这些软件中设计好的素材无缝导入Dreamweaver CC,并进行优化和整合。 前端技术的初步探索: 在掌握了HTML和CSS的基础之上,本书还将适时引入JavaScript等前端脚本语言的概念,并展示如何在Dreamweaver CC中进行简单的脚本集成,为你的网页增添更多动态和交互效果。 学习路径清晰,循序渐进 本书的学习路径设计得十分清晰,从基础概念的讲解,到具体功能的应用,再到复杂的项目实践,力求让你能够循序渐进,逐步掌握网页设计的精髓。 章节设置合理: 每一章都围绕一个特定的主题展开,例如“网页设计的入门与创意发想”、“布局与响应式设计”、“色彩与排版的应用”、“导航与交互体验”、“表单设计与用户引导”等等。 知识点由浅入深: 基础知识讲解清晰易懂,核心概念通过图文并茂的方式呈现,关键技术则通过详细的操作步骤进行演示。 课后练习与挑战: 每章结束后,都配有相关的练习题和设计挑战,帮助你巩固所学知识,并在实践中发现问题、解决问题。 项目驱动的学习: 本书将穿插一些小型项目,让你在完成项目的同时,能够将前面学到的所有知识融会贯通。 光盘资源:学习的强大助力 本书附带的光盘提供了丰富的学习资源,是辅助你学习的强大助力。 案例源文件: 光盘中包含了本书所有案例的源文件,你可以直接打开、研究、修改,甚至在此基础上进行二次创作,这是最直接的学习方式。 素材库: 预设的网页元素、图标、背景素材等,可以直接调用,极大地节省了你的设计时间。 视频教程: 针对一些关键的技术点和操作流程,光盘中可能包含简短的视频教程,让你能够更直观地理解和学习。 参考资料: 相关的设计规范、色板、字体推荐等,为你的设计提供专业的参考。 适合人群: 无论你是: 初学者: 想要系统学习网页设计,并掌握Dreamweaver CC这款强大工具。 在校学生: 正在学习设计、传播、计算机等相关专业,需要补充实践技能。 职场新人: 希望进入网页设计、前端开发等行业,需要快速入门。 已从业设计师: 希望提升自己的设计理念、学习新的设计趋势,并熟练掌握Dreamweaver CC的最新功能。 创业者/中小企业主: 希望自己能够独立或指导他人创建具有营销力的网站。 《Dreamweaver CC网页创意设计案例课堂》将是你开启网页创意设计之旅最坚实的起点,也是伴随你不断成长的得力伙伴。 我们相信,通过本书的学习,你将不仅能够掌握一项实用的技能,更能点燃你心中对网页创意的无限热情,设计出真正令人惊艳、具有影响力的数字作品。现在,让我们一起踏上这段精彩的学习旅程吧!

用户评价

评分

这本书的内容简直让人惊喜连连!我一直觉得网页设计是个挺复杂的事情,尤其是对于我这种对技术不太敏感的人来说,很多教程都让我望而却步。但是,这本《Dreamweaver CC网页创意设计案例课堂(附光盘)》完全颠覆了我的看法。 最吸引我的是它“案例课堂”的定位。书里没有枯燥的技术术语堆砌,而是通过一个个真实的、具有挑战性的设计项目,来教授Dreamweaver CC的功能和技巧。每个案例都涵盖了不同的设计风格和应用场景,从电商网站的促销页面,到企业官网的形象展示,再到个人作品集的搭建,几乎涵盖了我们日常能遇到的各种需求。 而且,作者在讲解案例时,不仅仅是教你“怎么做”,更重要的是告诉你“为什么这么做”。比如,在讲解某个布局的时候,会分析为什么这样排版更符合用户习惯,为什么选择这样的色彩搭配能更好地传达品牌信息。这种设计思维的引导,让我不再是机械地模仿,而是开始思考设计的逻辑和目的。 光盘里的资源更是帮了大忙。里面不仅有案例的源文件,还有一些常用的素材和模板,这对于我这样一个需要快速产出的设计师来说,简直是福音。我可以直接在源文件的基础上进行修改和调整,大大缩短了学习和实践的时间。而且,通过对比源文件和我自己尝试修改的效果,我能更直观地感受到自己的进步。 我特别喜欢书中关于“响应式设计”的讲解。这真的是当今网页设计不可或缺的一环,而这本书的案例清晰地展示了如何在Dreamweaver CC中实现响应式布局,让网页在不同设备上都能有良好的显示效果。这让我对制作跨平台网页充满了信心。 总之,这本书是一本非常实用且富有启发性的网页设计教程。它以案例为导向,注重设计理念的传达,并且提供了丰富的实践资源。我相信,只要跟着这本书认真学习,即便是设计新手,也能快速掌握Dreamweaver CC的核心技能,并能独立完成有创意的网页设计项目。

评分

这本书简直是为我量身定做的!我是一名平面设计师,一直对网页设计很感兴趣,但苦于没有系统学习的途径。市面上关于Dreamweaver的书籍很多,但要么过于理论化,要么内容陈旧。直到我看到了《Dreamweaver CC网页创意设计案例课堂(附光盘)》,简直像发现了宝藏! 这本书的优点真的太多了,首先,它不仅仅是讲解软件操作,更注重“创意设计”的理念。作者通过大量生动、实用的案例,一步步引导读者如何将创意想法转化为具有视觉冲击力的网页设计。从最初的概念构思,到色彩搭配、版式布局,再到交互元素的运用,每一个环节都讲解得非常透彻,而且案例的选择都紧跟潮流,很有代表性。 其次,这本书的内容组织非常有条理。每个案例都从需求分析开始,然后是设计思路的阐述,接着是具体的Dreamweaver操作步骤,最后还有作品的优化和发布建议。这种循序渐进的学习方式,让初学者也能轻松理解,并且能很快上手。光盘里的素材和源文件更是锦上添花,可以直接拿来学习和参考,大大节省了自己摸索的时间。 最让我惊喜的是,这本书在讲解Dreamweaver CC新功能的同时,并没有忽略基础的网页设计原理。很多时候,我们一味追求新技术的应用,反而忽略了网页的易用性和用户体验。这本书在这方面做得非常好,它教会我们如何在技术和用户需求之间找到平衡点。 总而言之,这本书不仅是一本Dreamweaver CC的使用指南,更是一本网页创意设计的实战宝典。我强烈推荐给所有想进入网页设计领域的朋友们,无论你是零基础还是有一定经验,都能从中受益匪浅。它让我对网页设计充满了信心,并且迫不及待地想将学到的知识运用到自己的项目中。

评分

我是一名初学者,对网页设计一直很感兴趣,但又觉得有点无从下手。偶然间发现了《Dreamweaver CC网页创意设计案例课堂(附光盘)》,这本书简直是为我这样的新手量身打造的。 首先,这本书的内容安排非常合理,循序渐进,一点都不吓人。它从最基础的Dreamweaver CC界面介绍开始,然后逐步深入到网页设计的各个方面,并且每个章节都是一个精心设计的案例。我最喜欢的是它的案例选择,都非常贴近实际应用,而且设计风格多样,让我能接触到不同的网页设计风格。 其次,书中对“创意”的强调让我耳目一新。它不仅仅是在教我如何使用工具,更是在引导我如何进行设计思考。比如,在讲解某个案例时,作者会详细分析设计思路,包括为什么要选择这样的布局,为什么使用这样的色彩搭配,以及如何通过交互设计来提升用户体验。这种深入的讲解,让我不再是机械地模仿,而是开始理解设计的逻辑。 光盘里的资源简直太有用了!里面有案例的源文件和一些常用的素材,我可以直接下载下来学习。通过对比源文件和我的练习,我能更清楚地发现自己的不足,并且从中学习到很多实用的技巧。而且,光盘里的素材也为我的设计提供了很多灵感。 最让我惊喜的是,这本书在讲解Dreamweaver CC新功能的同时,并没有忽略网页设计的核心原理。它教会我在使用各种新工具时,也要时刻关注网页的可用性和用户体验。这让我感觉自己学到的不仅仅是软件操作,更是实用的网页设计知识。 总之,这本书是一本非常优秀的网页设计入门教材。它内容丰富,案例生动,讲解透彻,并且提供了宝贵的实践资源。我相信,只要跟着这本书认真学习,我一定能快速掌握Dreamweaver CC,并且做出有创意的网页设计。

评分

最近工作需要,我一直在找一本能够快速上手并且能做出漂亮网页的Dreamweaver教程。市面上同类书籍很多,但大多都让我觉得不够深入或者内容过于陈旧。在朋友的推荐下,我入手了《Dreamweaver CC网页创意设计案例课堂(附光盘)》,这本书的质量完全超出了我的预期。 这本书最大的亮点在于它的“案例课堂”模式。它不是一本枯燥的软件手册,而是通过一个又一个鲜活的、具有代表性的实际项目,来教授Dreamweaver CC的各项功能和网页设计技巧。每个案例都设计得非常巧妙,并且都融入了最新的设计理念和技术趋势。 我尤其欣赏书中对“创意”二字的强调。作者不仅仅是在教我们操作,更是在引导我们如何思考,如何将创意转化为实际的视觉语言。从页面结构的规划,到色彩和字体的情感表达,再到交互元素的趣味设计,每一个环节都进行了细致的阐述和示范。这让我感觉自己不仅仅是在学习软件,更是在学习一种设计思维。 光盘里的资源更是锦上添花。里面包含的案例源文件和相关素材,对我这个急性子来说简直是福音。我可以快速地学习到案例的实现过程,并且可以直接在源文件的基础上进行修改和拓展,大大提升了我的学习效率。而且,通过对比源文件和自己的尝试,我能更清晰地发现自己的不足之处。 书中对于响应式设计的讲解也非常到位。在如今跨设备浏览的时代,如何制作一个能够适应各种屏幕尺寸的网页至关重要。这本书通过实际案例,清晰地展示了如何在Dreamweaver CC中构建响应式布局,以及如何进行相应的调试和优化。这让我在面对不同项目时,都能自信地应对。 总而言之,这本书是一本非常棒的网页创意设计实战教程。它内容充实,案例生动,讲解透彻,并且提供了丰富的实践资源。如果你想系统地学习Dreamweaver CC,并且希望在网页设计方面有所突破,那么这本书绝对是你的不二之选。

评分

我最近在学习网页设计,选择教材的时候特别纠结。有些书太理论化,学完感觉跟实际操作差太远;有些书操作性很强,但又缺乏设计的指导。直到我遇到了《Dreamweaver CC网页创意设计案例课堂(附光盘)》,才觉得找到了真正想要的。 这本书最让我印象深刻的是它的“创意”二字。它不是简单地教你如何使用Dreamweaver的各种工具,而是通过一系列精心设计的案例,引导读者去思考如何将自己的创意和想法落地。每个案例都像是一次小型的设计挑战,从最初的需求分析,到用户体验的考量,再到最终视觉效果的呈现,都提供了非常详细的思路和方法。 作者在讲解过程中,非常注重细节。比如,在讲到动画效果时,会分析不同动画对用户体验的影响,以及如何通过Dreamweaver CC来实现更流畅、更具吸引力的动画。在讲到代码优化时,也会给出一些实用的建议,让网页不仅好看,而且性能也更佳。 而且,这本书的案例涵盖的范围非常广,而且都非常贴近实际应用。有商业网站的设计,也有个人作品集的展示,甚至还有一些比较有艺术感的网页设计。这让我接触到了不同风格和类型的网页设计,拓宽了我的视野。 光盘里的资源也相当给力。里面的源文件和素材,让我可以更直观地理解案例中的设计逻辑和实现方式。我经常会把自己的设计和书中的源文件进行对比,从中学习到很多宝贵的经验。而且,可以直接修改源文件,快速尝试不同的设计方案,这对我来说是极大的帮助。 这本书的学习曲线也比较平缓。即使是对Dreamweaver不太熟悉的读者,也能通过书中的步骤化讲解,逐步掌握核心功能。作者还会在关键步骤提供一些技巧和注意事项,避免我们走弯路。 总的来说,《Dreamweaver CC网页创意设计案例课堂(附光盘)》是一本集理论、实践、创意为一体的优秀网页设计教材。它不仅教会我们如何使用Dreamweaver CC,更重要的是教会我们如何用它来创造有价值、有创意的网页设计。我非常推荐给所有对网页设计感兴趣的朋友们。

评分

帮别人买的,看起来还行!

评分

内容还可以,就是难度有点低并且目录做的不是很清晰,要找一些东西还要一个案例一个案例翻着看

评分

好书,很棒,对我帮助非常大!

评分

很不错

评分

Dreamweaver CC这本书的案例真多啊,哈哈,图书馆以及书店都去了,很多书上就那么几个例子,很多网页看了不少,就是没有思路,这本书包含的案例以及种类太全了65个啊,提气!打字太麻烦了,哎。不过欣喜之余还是想跟大家分享一下,哈哈,真的没想到这本书包含了这么多的种类:娱乐休闲类网页设计、电脑网络类网页设计、商业经济类网页设计、教育培训类网站设计、艺术爱好类网站设计、旅游交通类网站设计、生活服务类网站设计、购物网站设计这下无论是哪类网页都不触头了。呵呵,和大家分享,并推荐一下!

评分

方便快捷质量好价格低

评分

方便快捷质量好价格低

评分

送货速度给力!内容丰富!超级实用!

评分

不是我想的那样是代码的,全是利用其他工具做出来的,唉~算我买错了吧

相关图书

本站所有内容均为互联网搜索引擎提供的公开搜索信息,本站不存储任何数据与内容,任何内容与数据均与本站无关,如有需要请联系相关搜索引擎包括但不限于百度google,bing,sogou 等,本站所有链接都为正版商品购买链接。

© 2025 windowsfront.com All Rights Reserved. 静流书站 版权所有