第1章DreamweaverCS6创建基本文本网页

1、第1章DreamweaverCS6创建基本 文本网页 Dreamweaver CS6是业界领先的Web 开发工具，使用该工具可以高效地设计、开发 和维护网站。利用Dreamweaver CS6中的可视 化编辑功能，可以快速地创建网页而不需要编 写任何代码，这对于网页制作者来说，使工作 变得很轻松。文本是网页中最基本和最常用的 元素，是网页信息传播的重要载体。学会在网 页中使用文本和设置文本格式对于网页设计人 员来说是至关重要的 。 第1章DreamweaverCS6创建基本 文本网页 熟悉Dreamweaver CS6 掌握在网页中插入文本 掌握网页中的超链接创建 第1章Dreamweaver

2、CS6创建基本 文本网页 本章共分_课时 案例教学多媒体教学理论面授 课程范例文件：sample第1章 练习文件：exercise第1章 第1章DreamweaverCS6创建基本 文本网页 Dreamweaver CS6是最新推出的网页制作软件，它 提供了方便快捷的工具，不仅使得网页制作过程更加直观 ，同时也大大简化了网页制作步骤，以快速制作网站雏形 、设计、更新和重组网页 。 Dreamweaver CS6的工作界面是由菜单栏、插入栏 、文档窗口、属性面板以及浮动面板组组成，整体布局显 得紧凑、合理、高效 。 第1章DreamweaverCS6创建基本 文本网页 菜单栏包括【文件】、【编辑

3、】、【查看】、 【插入】、【修改】、【格式】、【命令】、【站 点】、【窗口】和【帮助】10个菜单 。 第1章DreamweaverCS6创建基本 文本网页 【属性】面板主要用于查看和更改所选对象的 各种属性，每种对象都具有不同的属性。在【属性 】面板包括两种选项，一种是“HTML”选项，将默 认显示文本的格式、样式和对齐方式等属性。另一 种是“CSS”选项，单击【属性】面板中的“CSS” 选项，可以在“CSS”选项中设置各种属性 。 第1章DreamweaverCS6创建基本 文本网页 文档窗口主要用于文档的编辑，可同时打开多 个文档进行编辑，可以在【代码】视图、【拆分】 视图和【设计】视图中

4、分别查看文档 。 第1章DreamweaverCS6创建基本 文本网页 插入栏中放置的是编写网页的过程中经常用到 的对象和工具，通过该面板可以很方便地使用网页 中所需的对象以及对对象进行编辑所要用到的工具 。 第1章DreamweaverCS6创建基本 文本网页 在Dreamweaver工作界面的右侧排列着一些浮 动面板，这些面板集中了网页编辑和站点管理过程 中最常用的一些工具按钮。这些面板被集合到面板 组中，每个面板组都可以展开或折叠，并且可以和 其他面板停靠在一起。面板组还可以停靠到集成的 应用程序窗口中。这样就能够很容易地访问所需的 面板，而不会使工作区变得混乱 。 第1章Dreamwe

5、averCS6创建基本 文本网页 Adobe Dreamweaver CS6软件使设计人员和 开发人员能充满自信地构建基于标准的网站。利 用 Adobe Dreamweaver CS6软件中改善的 FTP 性能，更高效地传输大型文件。更新的“实时视 图”和“多屏幕预览”面板可呈现 HTML5 代码， 使你能检查自己的工作。下面介绍Adobe Dreamweaver CS6软件的新特性和功能 。 第1章DreamweaverCS6创建基本 文本网页 使用响应迅速的CSS3自适应网格版面，来创 建跨平台和跨浏览器的兼容网页设计。利用简洁、 业界标准的代码为各种不同设备和计算机开发项目 ，提高工作效

6、率。协助你设计能在台式机和各种设 备不同大小屏幕中显示的项目。直观地创建复杂网 页设计和页面版面，无需忙于编写代码 。 第1章DreamweaverCS6创建基本 文本网页 利用重新改良的多线程 FTP 传输工具节省上传 大型文件的时间。更快速高效地上传网站文件，缩 短制作时间 。 第1章DreamweaverCS6创建基本 文本网页 使用Dreamweaver中集成的Business Catalyst 面板连接并编辑你利用Adobe Business Catalyst（ 需另外购买）建立的网站。利用托管解决方案建立 电子商务网站 。 第1章DreamweaverCS6创建基本 文本网页 使用

7、更新的jQuery移动框架支持为 iOS和 Android平台建立本地应用程序。建立触及移动受众 的应用程序，同时简化你的移动开发工作流程 。 jQuery Mobile 是jQuery 在手机上和平板设备 上的版本。jQuery Mobile 不仅会给主流移动平台带 来jQuery核心库，而且会发布一个完整统一的 jQuery移动UI框架。支持全球主流的移动平台 。 第1章DreamweaverCS6创建基本 文本网页 支持更新的 Adobe PhoneGap 支持可轻松为 Android 和 iOS 建立和封装本地应用程序。通过改 编现有的 HTML 代码来创建移动应用程序。使用 Phon

8、eGap 模拟器检查你的设计 。 第1章DreamweaverCS6创建基本 文本网页 将CSS属性变化制成动画过渡效果，使网页设 计栩栩如生。在处理网页元素和创建优美效果时保 持对网页设计的精准控制 。 第1章DreamweaverCS6创建基本 文本网页 使用更新的“实时视图”功能在发布前测试页 面。“实时视图”现已使用最新版的WebKit 转换引 擎，能够提供绝佳的 HTML5支持 。 第1章DreamweaverCS6创建基本 文本网页 利用更新的“多屏幕预览”面板检查智能手机 、平板电脑和台式机所建立项目的显示画面。该增 强型面板现在能够让你检查HTML5内容呈现 。 第1章Drea

9、mweaverCS6创建基本 文本网页 在使用Dreamweaver制作网页前，最好先定义 一个站点，这是为了更好地利用站点对文件进行管 理，尽可能地减少错误，如路径出错、链接出错等 。 第1章DreamweaverCS6创建基本 文本网页 Dreamweaver是最佳的站点创建和管理工具， 使用它不仅可以创建单独的文档，还可以创建完整 的站点。 第1章DreamweaverCS6创建基本 文本网页 还可以在【站点设置对象】对话框中选择【高 级设置】选项卡，快速设置【本地信息】、【遮盖 】、【设计备注】、【文件视图列】、【Contribute 】、【模板】、【Spry】和【Web字体】中的参数

10、 来创建本地站点 。 第1章DreamweaverCS6创建基本 文本网页 文本是传递信息的基础，浏览网页内容时， 大部分时间是浏览网页中的文本，所以学会在网 页中创建文本至关重要。在Dreamweaver CS6中 可以很方便地创建出所需的文本，还可以对创建 的文本进行段落格式的排版 。 第1章DreamweaverCS6创建基本 文本网页 文本是基本的信息载体，是网页中最基本的元素 ，在浏览网页时，获取信息最直接、最直观的方法就 是通过文本 。 第1章DreamweaverCS6创建基本 文本网页 输入文本后，可以在【属性】面板中对文本的 大小、字体、颜色等进行设置 。 第1章Dreamw

11、eaverCS6创建基本 文本网页 选择一种合适的字体，是决定网页美观、布局合 理的关键，在设置网页时，应对文本设置相应的字体 字号 。 第1章DreamweaverCS6创建基本 文本网页 在【属性】面板中还可以改变网页文本的颜色 。 第1章DreamweaverCS6创建基本 文本网页 在网页中除了插入文字和图像外，还可以插入日 期、水平线或特殊符号等 。 第1章DreamweaverCS6创建基本 文本网页 在Dreamweaver中插入日期非常方便，它提供了 一个插入日期的快捷方式，用任意格式即可在文档中 插入当前时间，同时它还提供了日期更新选项，当保 存文件时，日期也随着更新。 第1

12、章DreamweaverCS6创建基本 文本网页 特殊字符包含换行符、不换行空格、版权信息和 注册商标等，它是网页中经常用到的元素之一。当在 网页文档中插入特殊字符时，在代码视图中显示的是 特殊字符的源代码，在设计视图中显示的是一个标志 ，只有在浏览器窗口中才能显示真正面目 。 第1章DreamweaverCS6创建基本 文本网页 水平线在网页文档中经常用到，它主要用于分隔 文档内容，使文档结构清晰明了，合理使用水平线可 以获得非常好的效果。一篇内容繁杂的文档，如果合 理放置水平线，会变得层次分明、易于阅读。 第1章DreamweaverCS6创建基本 文本网页 超链接是一种网页上常见的对象，

13、它以特殊编码 的文本或图形来实现链接。如果单击该链接，则相当 于指示浏览器移至同一网页中的某个位置、打开一个 新的网页或打开某一个新的网站中的网页 。 第1章DreamweaverCS6创建基本 文本网页 要正确地创建链接，就必须了解链接与被链接文 档之间的路径，每一个网页都有一个惟一的地址，称 为统一资源定位符（URL）。网页中的超链接按照链 接路径的不同，可以分为3种。 第2种是相对URL的超链接。如将自己网页上的某 一段文字或某标题链接到同一网站的其他网页上面去 。 第3种称为同一网页的超链接，这就是要使用到书 签的超链接，一般用“#”号加上名称链接到同一页面 的指定地方。 第1章Dre

14、amweaverCS6创建基本 文本网页 同一个图像的不同部分可以链接到不同的文档， 这就是热点链接。要使图像特定部分成为超级链接， 就要在图像中设置热点，然后再创建链接。这样当鼠 标移动到图像热点的时候就会变成手的形状，当按下 鼠标的时候，页面就会跳转到或者打开链接的页面 。 第1章DreamweaverCS6创建基本 文本网页 在网页上单击电子邮件链接时，将使计算机上的 邮件程序打开一个新的空白邮件窗口，并在电子邮件 消息窗口中的【收件人】一栏自动显示电子邮件链接 中指定的地址 。 第1章DreamweaverCS6创建基本 文本网页 如果超级链接指向的不是一个网页文件，而是其 他文件（如zip、mp3或exe文件等），单击超链接的 时候就会下载文件。如果在网站中提供下载资料，就 需要为文件提供下载链接 。 第1章DreamweaverCS6创建基本 文本网页 有时候网页很长，为了找到其中的目标，不得不 上下拖动滚动条将整个文档的内容浏览一遍，这样就 浪费了很多时间，利用锚点链接能够更精确地使访问 者快速浏览到选定的位置，加快信息检索速度 。 第1章DreamweaverCS6创建基本 文本网页 脚本超链接执行JavaScript代码或调用JavaScript