下载文档原格式
【关键字】设计第1章Dreamweaver CS6简介Dreamweaver CS6是一款功能强大的可视化的网页编辑与管理软件。
利用它，不仅可以轻松地创建跨平台和跨浏览器的页面，也可以直接创建具有动态效果的网页而不用自己编写源代码。
Dreamweaver CS6 最主要的优势在于能够进行多任务工作，并且在操作方法、界面风格方面更加人性化。
用户可以根据自己的喜好和工作方式，重新排列面板和面板组，自定义工作区。
本章主要内容●Dreamweaver CS6的新增功能。
●Dreamweaver CS6的安装、删除和启动。
●Dreamweaver CS6的工作界面。
●Dreamweaver CS6的一般操作。
本章重点●Dreamweaver CS6常用面板的使用方法。
●Dreamweaver CS6的文件操作。
1.1 Dreamweaver CS6概述Dreamweaver CS6 是世界顶级厂商Adobe推出的一套拥有可视化编辑界面，用于制作并编辑网站和移动的软件。
在业界通常将Dreamweaver、Flash、Fireworks称为“网页三剑客”。
由于它支持代码、拆分、设计、实时视图等多种方式来创作、编写和修改网页，因此对于初级人员，无须编写任何代码就能快速创建Web页面。
其成熟的代码编辑工具更适用于Web开发高级人员的创作。
CS6新版本使用了版面创建页面，在发布前可使用多预览审阅设计,大大提高了用户的工作效率，而改善的FTP性能可更高效地传输大型文件。
“实时视图”和“多屏幕预览”面板可呈现HTML5 代码，用户能更方便地检查自己的工作。
1.2 Dreamweaver CS6的新增功能相对于以前的版本，Dreamweaver CS6的功能主要在以下方面进行了增强。
1. 可响应的自适应网格版面使用响应迅速的CSS 版面，可以创建跨平台和跨的兼容。
利用简洁、业界标准的代码可为各种不同设备和计算机开发项目，提高工作效率。
第2章Dreamweaver CS6基本操作本章重点：本章主要介绍创建站点、管理站点、设置网页的文本以及设置网页的超级链接。
学习目的：初步认识Dreamweaver CS6，为深入了解该软件做好基础。
参考时间：90分钟主要知识学习时间2.1 Dreamweaver CS6的工作界面20分钟2.2 创建站点10分钟2.3 管理站点内容10分钟2.4 网页文件的基本操作10分钟2.5 设置网页文本10分钟2.6 为网页添加图像10分钟2.7 设置超级链接10分钟2.8 插入Flash10分钟在该下拉菜单中包括了“新建”、“打开”、“关闭”、“保存”和“导入”等常用命在该下拉菜单中包括了“拷贝”、“粘贴”、“全选”、“查找和替换”等用于基本编辑在该下拉菜单中包括了设置文件的各种视图命令，如“代码”视图和“设计”视图等，还用于将各种网页元素插入到当前文件中，包括“图像”、“媒体”和“表格”等。
Dreamweaver CS6的工作界面菜单栏“插入”下拉菜单“文件”下拉菜单“编辑”下拉菜单“查看”下拉菜单修改：为 AP Div”等。
格式：命令：站点：有面板、检查器和窗口的访问。
的访问。
“窗口”下拉菜单“代码”按钮：单击该按钮，仅在文件窗口中显示和修改HTML源代码。
“拆分”按钮：单击该按钮，可在文件窗口中同时显示HTML源代码和页面的设计效果。
“设计”按钮：单击该按钮，仅在文件窗口中显示网页的设计效果。
“在浏览器中预览/调试”按钮单击该按钮，在弹出的下拉菜单中选择一种浏览器，用于预览和调试网页。
提示：在下拉菜单中选择“编辑浏览器列表”命令，弹出“首选参数”对话框，在该对话框中可以设置主浏览器和次浏览器。
“文件管理”按钮：单击该按钮，在弹出的下拉菜单中包括“消除只读属性”、“获取”、“上传”和“设计备注”等命令。
“检查浏览器兼容性”按钮：钮，在弹出的下拉菜单中包括“检查浏览器兼容“标题”文本框：标题。
状态区位于文件窗口的底部，提供与用户正在创建的文件有关的其他信息。
Dreamweaver CS6创建基本文本网页
1.2.4————————增强型jQuery 移动支持
使用更新的jQuery 移动框架支持为ios和Android 平台建立本地应用程序。
建立触及移动受众的应用程序，同时简化移动开发工作流程。
jQuery Mobile 是jQuery 在手机上和平板设备上的版本。
jQuery Mobile不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整统一的jQuery 移动UI框架。
另外，还支持全球主流的移动平台。
1.2.5————————更新的PhoneGap
更新的Adobe PhoneGap tm可轻松为Android和ios建立和封装本地应用程序。
通过改编现有的HTML代码来创建移动应用程序。
使用PhoneGap模拟器检查你的设计。
1.2.6———————CS3过渡
将CSS属性变化制成动画过渡效果，使网页设计栩栩如生。
在处理网页元素和创建优美效果时保持对网页设计的精准控制。
1.2.7———————更新的实时视图
使用更新的“实时视图”功能在发布前测试页面。
“实时视图”现已使用最新版的WebKit转换引擎，能够提供绝佳的HTML5支持。
1.2.8———————更新的多屏幕预览面板
利用更新的“多屏幕预览”面板检查智能手机、平板电脑和台式机所建立的显示画面。
该增强型面板现在能够让用户检查HTML5内容呈现。
1.3————————创建本地站点
在使用Dreamweaver制作网页前，最好先定义一个站点，这是为了更好地利用站点对文件进行管理，尽可能地减少错误，如路径出错、连接出错等。
1.3.1—————————使用向导建立站点
Dreamweaver是最佳的站点创建和管理工具，使用它不仅可以创建单独的文档，还可以创建爱你完整的站点。
创建本地站点的具体操作步骤如下：
○1选择【站点】|【管理站点】命令，弹出【管理站点】对话框，在对话框中单击【新建】按钮。
○2弹出【站点设置对象】对话框，在对话框中选择【站点】选项卡，在【站点名称】文本框中输入名称，可以根据网站的需要任意起一个名字。
○3单机【本地站点文件夹】文本框右边的浏览文件夹按钮，弹出【选择根文件夹】对话框。
选择站点文件。
○4单机【选择】按钮，选择站点文件。
○5单机【保存】按钮。
更新站点缓存，出现【管理站点】对话框，其中显示了新建的站点。
○6单机【完成】按钮，此时在【文件】面板中可以看到创建的站点文件。
1.3.2———————使用高级设置建立站点
在【站点设置对象】对话框中选择【高级设置】选项卡，快速设置【本地信息】、【遮盖】、【设计备注】、【文件视图列】、【Contribute】、【模板】、【Spry】和【Web字体】中的参数来创建本地站点。
打开【站点设置对象效果】对话框，在对话框中【高级设置】中选择【本地信息】。
在【本地信息】选项中可以设置一下参数。
在【默认图像文件夹】文本框中，输入此站点的默认图像文件夹路径，或者单击文件夹按钮浏览到该文件夹。
此文件夹是Dreamweaver上传到站点上的图像和位置。
在【Web URL】文本框中，输入已完成的站点将使用的URL。
【启用缓存】复选框表示指定是否创建本地缓存以提高链接和站点管理任务的速度。
在对话框的【高级设置】中选择【遮盖】选项。
在【遮盖】选项中可以设置一下参数。
启用遮盖：选中后激活文件遮盖。
遮盖具有以下扩展名的文件：勾选此复选框，可以对特定文件名结尾的文件使用遮盖。
在对话框中的【高级设置】中选择【设计备注】选项，在最初开发站点，需要记录一些开发过程中的信息，备忘。
如果在团队中开发站点，需要记录一些与别人共享的信息，然后上传到服务器，供别人访问。
在【设计备注】选项中可以进行如下设置。
维护设计备注：保存设计备注。
清理设计备注：单击此按钮，删除过去保存的设计备注。
启用上传并共享设计备注：在上传或取出文件的时候，可以将设计备注上传到“远程信息”中设置的远端服务器上。
在对话框的【高级设置】中选择【文件视图列】选项，用来设置站点管理器中的文件浏览器窗口所显示的内容。
在【文件视图列】选项中可以进行如下设置：
名称：显示文件名。
备注：显示设计备注。
大小：显示文件大小。
类型：显示文件类型。
修改：显示修改内容。
取出者：正在被谁打开和修改。
在对话框的【高级设置】中选择【Contribute】选项，勾选【启用Contribute兼容性】复选框，则可以提高与Contribute用户的兼容性。
在对话框中【高级设置】中悬着【模板】选项。
在对话框的【高级设置】中选择【Spry】选项。
在对话框的【高级设置】中选择【Web字体】选项
1.4——————添加文本元素
文本是传递信息的基础，浏览网页内容是，大部分时间是浏览网页中的文本，所以学会在网页中创建文本至关重要。
在Dreamweaver CS6中可以很方便地创建出所需的文本，还可以对创建的文本进行段落格式的排版。
1.4.4——————在网页中添加文本
文本是基本的信息载本，是网页中最基本的元素，在浏览网页时，获取信息最直接、最直观的方法就是通过文本。
下面通过是咧讲述如何在网页总添加文本。
○1打开网页原始文件index.htm。
○2将鼠标指针放置在要输入文本的位置，输入文本。
1.4.2——————设置文本字体类型
输入文本后。
可以在【属性】面板中对文本的大小、字体和颜色等进行设置。
设置文本属性的具体操作步骤如下。
○1在【属性】面板中的【字体】下拉列表中选择“编辑字体列表”选项。
○2在对话框中的【可用字体】列表框中选择要添加的字体，单机按钮《《添加到左侧的【选
择的字体】列表框中，在【字体】列表中也会显示新添加的字体，重复以上操作即可添加多种字体，若要取消以添加的字体，可以选中该字体单击按钮》》。
○3完成一个字体样式的编辑后，单击按钮+可以进行下一个样式的编辑，若要删除某个已经
编辑好的字体样式，可以选中该字体样式单击—按钮。
完成字体样式的编辑后，单击【确定】按钮关闭该对话框。
○4这里是选择【字体】为“宋体”，弹出【新建CSS规则】对话框，在对话框的【选择器类
型】中选择“类”，在【选择器名称】中输入名称，在【规则定义】中选择“仅限该文档”。
提示：选择【格式】|【字体】|【编辑字体】命令，在弹出的【编辑字体列表】对话框中添加新字体。
1.4.3——————设置文本大小
选择一种合适的字体，是决定网页美观、布局合理的关键，在设置网页时，应对文本设置相应的字体字号。
选中要设置字号的文本，在【属性】面板中的【大小】下拉列表中选择字号的大小，或者直接在文本框中输入相应大小的字号。
1.4.4——————设置文本颜色
在设置时，还可以改变网页文本的颜色。
设置文本颜色的具体操作步骤如下。
○1选中设置颜色的文本，在【属性】面板中单击【文本颜色】按钮，打开调色板。
○2在调色板中选中所需的颜色，鼠标指针变为吸管时。
单击鼠标左键即选取该颜色，单击【确定】按钮蛇者文本颜色。
