DW学习笔记

 一、快捷键。

 1 1、F4:打开/隐藏面板。

 二、 、Dreamweaver 技巧荟萃.

 1. 同时链接两个网页

 通常在网页中设置的超链接一次只能链接到一个网页中, 如果需要在不同的框架页中打 开新页面,可以使用“转到 URL”行为来实现。打开一个有框架的网页,选择页面中的需 要设置链接的文字或图像,单击“行为”面板上的“添加行为”菜单命令,在弹出菜单中选 择“转到 URL”选项,弹出“转到 URL”对话框,在该对话框中显示所有可用的框架,选 择其中一个需要设置链接的框架并输入相应的链接地址后再选择另一个框架并输入另一个 链接地址。

  2. 不要为网页文件使用中文名称

 在制作网页时,初学者起一个容易记忆的中文名称作为文件名,这种做法是不正确的。

 因为 Dreamweaver 对中文文件名称支持得不是太好,经常会有页面调用不正确的现象发生, 所以在 Dreamweaver 中保存网页的时候,尽量使用英文或者数字作为文件名称,这样就可 以避免上面的出错现象。

 3. 设置不同分辨率

 制作好的网页在本地计算机上浏览时很正常, 但在另外一台计算机上浏览时发现原本漂 亮的网页变得歪歪扭扭了。这主要是因为每台计算机的分辨率不同所导致的,为了使所制 作的网页在不同分辨率的计算机上都能正常显示,在

 Dreamweaver 中得到了较好的解决, 在文档窗口的右下角,Dreamweaver 显示当前文档被设计成的分辨率大小。单击数字,在 弹出式菜单中可以为当前的页面指定显示分辨率,通过修改可以使设计的网页更具灵活性, 使不同分辨率的显示器都能较好地显示。

 4. 图像拖放技巧

 在使用 Dreamweaver 编辑网页的时候,经常需要插入一些图像什么的,如果要插入的 图像很多, 按照常规方法来操作就显得非常麻烦。

 可以利用拖放技巧来很好地解决这个问题。

 可以打开“文件”面板,在本地站点中的找到图片文件夹,在该文件夹中将图片一一拖入页 面中相应的位置,Dreamweaver 将自动把这些图像的路径地址添加到文件的 HTML 代码中。

  5. 巧妙复制文字

 如果从 Dreamweaver 中复制编辑区中的文字到另外一个应用程序的时候,HTML 代码 和文字将一起被复制过去了, 那么该如何才能只把编辑区中的文字复制下来呢?通常复制时 都使用快捷键

 Ctrl+C 来操作,如果在复制的时候多按一个 C 键,那么 Dreamweaver 将只 会复制选中的文字了。

 6. 使用快捷键

 为了提高操作的效率,可以在 Dreamweaver 中使用快捷键,例如使用 Ctrl+B 或 Ctrl+I 来为文字应用黑体或斜体格式, 也可以使用以下一些键盘快捷键来为选中的文本应用 HTML 格式:无格式(Ctrl+0)

 ;段落(Ctrl+T)

 ;标题 1(Ctrl+1)

 ;标题 2(Ctrl+2)

 ;标题 3(Ctrl+3);(Ctrl+4)标题 4;(Ctrl+5)标题 5;(Ctrl+6)

 标题 6。

 7. 同时编辑多个 HTML 文档 在 Dreamweaver 中,可以同时对多个 HTML 文档进行编辑,只要执行“文件>新建”或“文件>打开”菜单命令,就可以在不退出当前文档的情况下,新建或打开另一个 HTML 文档进行编辑。

 8. 输入连续空格

 在每段的开头,一般都要空两个格,而直接用空格键只能输入一个半角空格,然后无论如何键入空格都不起作用。可以通过下面两个方法来实现输入空格。

 ⑴切换到中文输入状态, 把标点状态设置为全角中文,就可以随心所欲地输入全角空格了。

 ⑵光标定位需要输入空格的位置,转换到代码视图中,在 HTML 源文档中输入“ ”代码。

 [3]CTRL+SHIFT+空格键。

 [4]在文本工具栏的最后一项中找到不换行空格。

 [5]编辑—首选参数—常规—允许多个连续的空格(选中)(此法为一劳永逸的方法)。

 9. HTML 源代码下工作

 单击 “文档” 工具栏上的“代码” 按钮 ,转换到代码视图中, 可以在这里进行 HTML 标签及内容的输入。还可以单击“折分”按钮 ,Dreamweaver 折分为代码视图和设计视图两个部分,可以同时输入 HTML 标签和网页内容。

 10.

 HTML 标签的作用范围

 HTML 标签需要在 HTML 源代码状态下输入才有效, 例如在编辑区直接输入“ ”, 显示在编辑区屏幕上的主是“ ”字符串,而在 HTML 源代码中输入“ ” ,在编 辑区屏幕上没有任何显示,在浏览时则是一个半角空格。

 11. 特殊字符在编辑区中的显示

 在编辑状态下, 特殊字符并不显示为最终的样子。

 而是有两种情况,一是什么也不显示, 一是显示特殊字符的代码,如版权符显示为:

 “©”。

 12. 插入特殊字符的方法

 这些代码是直接写到 HTML 代码中去的,而直接在编辑区中输入的则只显示为普通字符。

 13. 输入其他字符

 在“插入”栏上的“文本”选项卡中的最后一个按钮是“字符”按钮,单击该按钮,在弹出菜单中选择“其他字符”选项,弹出“插入其他字符”对话框,在该对话框中列出了英文中所有的特殊字符,用户可以从中选择所需要的字符。

 14. 经常保存

 在进行到一个比较确定的步骤时,建议保存文件。这样做有两个好处:一是可以防止忽然断电等原因引起的数据丢失;二是可以清除不必要的撤消步骤,释放内存。

 15. 标签选择器

 安位于状态栏的最左边,标签选择器中显示的是光标所在位置周围的 HTML 标签,当选择其中一个 HTML 标签时,这个 HTML 标签及其中的内容都将被选中。在许多情况下,例如在表

 格嵌套时,如果嵌套的表格边框和空白都设置为 0 时,通过鼠标几乎不可能准确地选中每个表格,此时利用标签选择器就可以轻松快捷地进行选择。

 16. 剪切

 “剪切”命令的作用类似于复制,不同的是,“剪切”命令在复制内容后,把原来的内容删除。所以在想把一部分内容移到另一部分去的时候,可以先剪切原内容,然后在新加内容的地方进行粘贴。

 17. 通过鼠标拖放进行复制与粘贴

 选中要复制的文字后,把鼠标移到选择区上,然后可以直接拖动将它移到新的位置,如果按下Ctrl 键,则相当于复制后粘贴。

 18. 从 Word 获取大量文本内容

 Word 是常用的文字处理软件,可能网页中许多内容需要从 Word 中获取。直接通过粘贴的方法需要手工进行分段,而通过作为文本粘贴的方法则需要手工删除多余的换行标签,而且这两种方法都将丢失文字属性的信息。常用的方法是,先把 Word 文档保存为 HTML 格式,然后通地 Dreamweaver 打开,再执行“命令>清理 Word 生成的 HTML”菜单命令进行代码优化。

 19. 在两个 HTML 文档之间工作

 利用 Dreamweaver 可以同时对多个 HTML 文档进行编辑,经常会需要把一个 HTML 文档的文字复制到别一个文档中,此时需要注意两种情况,如果想连同文字格式(例如大小、字体、颜色等)原封不动地直接复制到另一个 HTML 文档中,可采用常规的“拷贝”和“粘贴”方法。如果只需要文字内容,而不需要复制文字的格式,这时可以通过“拷贝”和“粘贴 HTML”的方法进行。

 20. 个人词典

 有一些专有名词 Dreamweaver 不认识,可以把它们加入个人词典,这样在拼写检查时Dreamweaver 就不会对这些单词报错了。

 21. 插入的图像地址

 在 HTML 文档中插入图像其实只是写入一个图像链接地址,而不是真的把图像插入到文档中。

 22. 使用相对地址和绝对地址的方法

 在网页中插入图像,在弹出的“选择图像源”对话框中,如果在“相对于”下拉列表中选择“文档”选项是使用相对地址;而选择“站点根目录”选项是使用绝对地址。

 23. 图像文本说明的作用

 图像的文本说明起到两个作用。第一是当鼠标移动到这些图片上时,如果给图像加上了说明文本,浏览器可以在鼠标指针右下方弹出一个黄底的说明框,为浏览者提供提示。第二是当浏览器禁止显示图片时,如果给图像加上了说明文本,可以在图片的位置显示出这些文本。

 24. 低分辨率图像与图像渐进

 在浏览网页时,会碰到这样的一种情况:图像首先非常模糊,然后会渐渐变得清晰。这种情况

 叫图像渐时。图像渐进是在保存图像时进行设置的,无论是 GIF 和 JPEG 都可以设成渐进模式。它和低分辨率图像不同的是,它并没有一个专门的缩略图文件,所以它的下载时间小于低分辨率图像加原图像的下载时间。在多数情况下,推荐采用图像渐进的方法来角决浏览者等待的情况。

 25. 为鼠标经过图像加入超链接

 可以在“插入鼠标经过图像”对话框中的“按下时,前往的 URL”文本框中输入它的超链接,也可以单击鼠标经过图像后,在“属性”面板上的“链接”文本框中输入它的超链接。

 26. 改变导航按钮的顺序

 在导航条插入完毕后,如果对导航按钮的顺序不满意,可以通过“插入导航条”对话框中的向上或向下三角按钮进行调节。

 27. 修改导航条

 导航条插入完毕后,如果还想对它进行修改,可以参照下面的方法进行。

 再次单击“插入”栏上的“常用”选项卡中的“导航条”按钮,此时会弹出一个提示框,提示每页只能有一个导航条, 而本页已经有一个导航条了, 是否需要对它进行修改。

 单击“确定”按钮就可以调出“修改导航条”对话框对导航条进行修改。

 28. 理解 URL

 URL(Uniform Resource Locator,统一资源定位符)是对文件名的扩展。在单机系统中,定位一个文件需要路径和文件名称,对于遍布全球的 Internet 网,显然还需要知道文件存放在哪个网络的哪台主机中才行。在单机系统中,所有的文件都由统一的操作系统管理,因而不必给出访问该文件的方法;而在 Internet 中,各个网络、各台主机的操作系统可能不一样,因此必须指定访问该文件的方法。

 29. 标题的作用

 标题经常被网页初学者忽略,因为它对网页中的内容不产生任何影响。其实在我们浏览网页时,会在浏览器的标题栏和状态栏中看到网页的标题,在进行多个浏览器窗口切换时,它可以很明白地提示当前网页信息。而且,当浏览者收藏一个网页时,也会把网页的标题列在收藏夹中。

 如果不对网页标题进行任何设置,Dreamweaver 会自动给网页加上一个“无标题文档”,这会给人一种不专业的感觉,所以在制作网页时,应该加上标题。

 30. 跟踪图像

 跟踪图像是网页排版的一种辅助手段,主要是用来进行图像的对位,它只在网页编辑时 有效,对 HTML 文档并不产生任何影响。

 31. 关键字及网页说明的作用

 输入一个关键字检索时,在搜索引擎上不仅可以查到很多网站,还可以查到很多网页。

 大部分搜索引擎在查询网页时都是根据头元素里的关键字来进行的, 显示的内容也是在头元 素中的描述。当然,现在大的搜索引擎一般都可以做到网页的全文检索了,不过为了使网页可以适合更多的搜索引擎,在头部加入关键字和描述是十分有益的。

 32. 快速打开“历史记录”面板

 使用快捷键 Shift+F10 可以快速打开“历史记录”面板。

 33. 重做操作的对象

 如果要重做的操作是设置对象(文字或图像等)的属性,一定要先选中相应的对象。

 34. 选择性的重做

 在“历史记录”面板中选择一步或多步操作,然后单击“重放”按钮。

 35. 修改批处理命令

 保存的批处理命令在“命令”菜单中出现。可以打开“命令”菜单,选择“编辑命令列 表”命令来对命令列表进行编辑,在弹出的“编辑命令列表”对话框中可以更改命令的名称 或删除不需要的命令。

 36. 录制命令

 在录制命令期间无法使用鼠标的选择功能,除了“修改”工具栏、 “属性”面板和各个 面板中的内容,所以在编辑网页时使用键盘是相当必要的。

 37. 使用键盘选择文字

 按住 Shift 键,然后按左右方向键可以选择文字。

 38. 清除特定标签

 在网页设计时,应用样式表的同时可能还用到<font>标签,这些<font>标签是冗余的, 在清除特定标签栏中填入<font>可以将它们清除掉。

 39. “清理 Word 生成的 HTML”对话框

 在清理 Word 生成的 HTML 格式时,对于繁多的选项有的人可能不知所措,这时完全可 以在默认的选项下清除格式,因为 Dreamweaver 中默认的选项完全可以达到清除的目的。

 40. 网站相册

 在创建网站相册时,Dreamweaver 会生成一个批处理的操作,启动 Fireworks,在其中 执行这个批处理操作,将生成缩略图和全屏的图像,再由 Dreamweaver 创建各个图像的网 页。

 41. 格式化 HTML 源代码

 Dreamweaver 的 HTML 源代码配置文件在 Dreamweaver 安装目录下 Configuration 子文 件夹中的 SourceFormat.txt 文件中。在这个文件中包含了对 HTML 源代码的缩进、行的长度 和标签与属性的名称等设置。

 42. 使用另外两种方法插入表格

 可以执行“插入>表格”菜单命令,或使用快捷键 Ctrl+Alt+T 快速插入表格。

  43. 表格宽度设置

 插入表格时,可以对插入的表格的宽度进行设置。可以设置为百分比,这个比例是相对于网页大小而言的。如果要精确地指定表格宽度的话,可以选择“像素”做为表格宽度的单位。

 44. 快速选择整个表格

 将光标放在表格中的单元格内,使用快捷键 Ctrl+A 选中鼠标所在单元格,再使用一次 Ctrl+A键则选中整个表格。

 45. 使用标签选择器

 Dreamweaver 给设计者提供了标签选择器,用于在编辑界面中使用鼠标选取较难选择的 HTML标签,这项功能不但可以清晰明了地选择标签,还可以对其他的功能起辅助作用。

 46. 选择行或列

 与处理整个表格类似,设计者有若干种选择行或列的方法。然而,没有一种方法是使用菜单来完成的,行或列的选择基本上是使用鼠标来进行处理的。事实上,用户单击鼠标便可以选择整行或整列。

 47. 选择单元格

 有时对表各中的一小部分进行简单的编辑,如改变首行的背景颜色,需要选择单元格。另外,还可以使用快捷键 Ctrl+A,选中光标所在的单元格。

 48. 快速选择多个单元格

 可以将光标定位在第一个单元格中,然后按住 Shift 键,用鼠标单击最后一个单元格。

  49. 快速追加一行

 将光标定位在最后一行的最后一个单元格中, 按下 Tab 键,在当前行下会添加一个新行。

  50. 删除行和列位置

 在删除行和列时,行会从表格的右侧开始删除,列会从表格的下部开始删除。

 51. 快速删除行和列

 在表格中选中一整行或一整列,然后按 Delete 键,即可快速删除行和列。

 52. 表格高度设置

 通常并不需要设置表格的高度,因为 Dreamweaver 将自动为表格设置高度。

 53. 功能提示

 在“属性”面板中,在高级选项中左侧有几个按钮,在按钮上停留一定的时间后,鼠标附近就会出现一条文字,显示按钮的名称,从名称中可以了解其大致的用途。

 54. 帮助信息

 在遇到困难时,单击“属性”面板上的“帮助”按钮,会弹出浏览器窗口,显示帮助信息。

 55. 设置边框

 表格的边框宽度是以像素来表示的,默认值为 1 像素。宽度设为 0 时,边框不可见,Dreamweaver 用虚线段来表示边框。

 56. 分隔表格数据的分隔符

 在“导入表格式数据”对话框中的“发隔符”下拉列表中选择分隔表格数据的分隔符。其中包括了 Tab、逗号、分号、引号和其他,当选择“其他”选项时,旁边会出现一个文本框,你可以在其中输入需要使用的任意分隔符。如果未指定分隔符或者在文件中未使用任何分隔符,数据的导入将会出错,而且系统不会自动进行错误提示。

 57. 另一种方法导入表格数据

 执行“文件>导入>表格式数据”菜单命令,可以导入表格数据。

 58. 导出表格的一部分数据

 在导出表格的时候,整个表格都将被导出。如果只想导出表格中某一部分数据,例如前六行或前六列的数据,那就先创建一个新的表格,将你要用到的资料复制进去,然后再导出新的表格。

 59. 制作网页框架的原则

 在制作嵌套表格时应遵循如下原则:

 要规划好再运行,甚至要进行无数次的实验和重复运行才能制作出好的框架。从外向内工作。先建立最大的表格,再在它内部创建较小的表格。在外部使用绝对计量方法,在内部使用相对计量方法。这不是一个不容改变的规则,但最好将外部表格宽度设为一个特定的绝对像素值,而将内部表格宽度设为相对的百分比数,这样可以节省计算宽度的时间。

 60. 新建布局单元格

 如果在新建布局表格之前新建一个布局单元格, 系统会自动创建一个布局表格作为布局 单元格的容器,即布局单元格不能脱离布局表格而存在。

 61. 一次新建多个布局单元格

 按住 Ctrl 键的同时绘制布局单元格,可以连续创建多个布局单元格。

 62. 自动吸附功能

 当新建布局单元格时,如果和另一个单元格相距很近(小于 8 个像素)或者和布局表格的边界相距很近(小于 8 个像素)

 ,这个单元格会自动吸附。如果要取消自动吸附功能,在绘制单元格的同时,按住 Alt 键即可。

 63. 布局表格的边框颜色

 在默认状态下,单元格边框是蓝色,当鼠标放上去时是红色,表格边框是绿色,背景色是灰色,可以在用户参数设置中进行更改。

 64. 使用网格 显示网格,可以更好地对布局单元格和布局表格进行精确定位。

 65. 向布局单元格中添加内容

 如果要在布局表格中添加内容,比如文本、图像等网页元素,必须要先在布局表格中建立布局单元格,然后向布局单元格中添加内容。

 66. 快速选中布局单元格

 按住 Ctrl 键,同时在想要选中的单元格内任意处单击鼠标,即选中了单元格格。

 67. 布局单元格属性

 在“宽”选项区中可以设置单元格的宽度,其中有两种方式,一种是固定数值的,一种是自动伸展的,相当于标准视图下表格宽度以百分比表示;在“高”文本框中可设置单元格的高度;在“背景颜色”选项中可设置单元格的背景颜色;在“水平”和“垂直”下拉列表中可分别设置水平和垂直的对齐方式;而选择“不换行”复选框可以防止单元格中的文本自动换行。

 68. 布局表格属性

 “宽” 、 “高”和“背景颜色”选项均与单元格一样; “填充”是指单元格中的内容和单 元格边框之间的距离; “间距”是指单元格之间的距离;单击“清除行高”按钮可清除表格 的行高,作用与“清除单元格高度”相类似;单击“使单元格宽度一致”按钮可使单元格宽度和单元格内容宽度一致;单击“移除所有分隔符图像”按钮可以清除所有的透明分隔符图像;单击“清除嵌套”按钮可清除嵌套表格,可以不损失页面已输入的内容,而直接删除嵌套表格。

 69. “布局视图”参数解释

 在“自动插入间隔符”选项中可设置是否自动插入间隔符;在“间隔图像”选项区中,在“站点”下拉列表中可选择哪个网站设置间隔图像,而在“图像文件”选项中可自己指定或让系统创建新的图像。“单元格外框”是指单元格一般情况下的边框颜色, “单元格高亮”指是鼠标放上去时单元格边框的颜色; “表格外框”是表格边框的颜色,“表格背景”是指表格的背景颜色。

 70. 间隔图像

 所谓间隔图像就是在自由伸缩的表格中用来控制表格宽度的透明图像,这幅图片并不在浏览器中出现。可以在列头菜单中为单元格添加间隔图像。

 71. 表单元素的主要属性

 表单元素的主要属性有“方法” 、 “动作”等,其中“方法”表示表单提交的方工是 POST 还是 GET。“动作”是告诉表单将收集到的数据送到什么地方,一般这里是指向处理表单数据的服务端程序或者是 mailto 标签。

 72. 使用 mailto 标签

 在许多情况下,特别是制作个人主页时,服务器端的权限是不开放的,就没有办法用服务端程序的方法来处理表单。如果还想使用表单,只有用 mailto 标签,填上邮件地址,这样表单内容就会通过电子邮件传给 mailto 的邮件地址。

 73.

 POST 与 GET 的区别

 一般 GET 方式是将数据附在 URL 后发送,数据长度不能超过 100 个字符,一般搜索引擎中查找关键词等简单操作通过 GET 方式进行。而 POST 则不存在字符长度的限制,并且不会把内容附加到 URL 后,比较适合内容较多的表单。

 74. 删除或者修改一个表单

 如果想删除或者修改一个表单, 可以通过右键单击红色虚线框打开快捷菜单,在其中选择“删除标签<form>”选项,可以删除表单。选择其他项目可以对表单进行修改。

 75. 文本域

 文本域主要有三种形式,即单行、密码和多行,可以在“属性”面板中的“类型”选项组中进行切换,在文本域中主要是输入文本。单行文本域只能输入单行的文本,通过“属性”面板上的“字符宽度”选项可控制单行文本框的宽度,通过“最大字符数”选项可控制输入的最长字符数,在“初始值”文本框中可以输入初始文字。密码域的主要特点是不在表单中显示具体输入的内容,而是用*来替代显示。它主要被用来验证密码,具体的验证仍然需要通过 JavaScript等程序进行。多行文本域可以显示和输入多行文字,可以通过“行数”选项控制显示的行数,而“换行”下拉列表可用来控制如何换行。

 76. 变量名的设置

 在进行单选项设置时,单选按钮变量名称非常重要,如果不进行任何改变,无论你插入多少个单选项,也无论这些单选项分布在多少行中,它们中只能选择一个。如果在表单中还有另一个单选项目,则必须更改这个单选项目中 radio button 的变量的名称。

 77. 使用图形按钮

 在提交表单时,如果不想千篇一律地使用标准按钮,则可以通过使用图形按钮的方法来美化网页。在表单结尾处,单击“表单”选项卡中的“图像域”按钮,然后选择合适的图像即可。

 78. 插入跳转菜单时选择是否加上“前往”按钮

 在插入跳转菜单时,可以选择是否加上“前往”按钮,默认是没有该按钮的,选择其中一个链接时网页就开始跳转, 如果加上“前往”按钮,选择链接时网页不跳转,必须按下“前往”按钮后才跳转。

 79. 框架构成及设置

 一个框架实际上是由几个 HTML 文档所构成的,其中一个专门负责框架的设置:是分行型还是分列型,或者是混合型;行和列的尺寸如何等等。另外的就是普通的 HTML 文档,分别被放置到各框架中,当链接到设置框架的 HTML 文档时,整个框架以及各 HTML 文档就会一起显示在浏览器中。

 80. 系统预设的框架类型

 在“插入”栏中的“框架”选项卡中,提供有 13 个程序预设的框架类型,它们代表了框架设计中最常用的几种类型,你可以逐个进行试验,看看哪些类型的框架最适合你。

  81. 删除框架

 框架创建完成后,如何进行删除呢?刚开始建立时可以执行“撤消”命令,如果在操作了一段时间后想删除框架,通过菜单是不能实现的,必须通过鼠标操作,用鼠标拖动框架间的边框,一直将它拖动到最边上,就可以删除一个框架了。

 82. 随意创建框架格式的两种方法

 重复插入框架和分割框架都可以随意创建框架格式,我们推荐第一种方法,理由是重复插入框架时,每个框架都会自动命名,提高了效率;而且框架的形式是用 rows=”*,80”这样只指定一个分框架大小的语句,可以适应各种分辨率的浏览器窗口。

 83. 用拖动鼠标的方法来分割框架

 可以用拖动鼠标的方法来分割框架,先执行“查看>可视化助理>框架边框”菜单命令,显示出框架的边框,然后移动鼠标到四个边框或四角,在出现移动箭头时,拖动鼠标即可分割框架。

 84. 制作一个自己的框架

 先规划你所需要的框架,然后按照各个分支框架之间的位置关系:上、下、左、右,用菜单命令对其进行划分,再改变各框架的相应属性值,将框架做好后保存。

 85. 使分框架成为一个整体

 虽然应用框架后页面被分为几个部分,但出于美观考虑,我们依旧想让这些分框架看起来像是一个整体。一般采用的方法是把框架的边界设置为 0。然后把导航框中的元素确定位置,不进行移动,使滚动条只出现在主框架中。

 86. 框架属性设置级别

 分框架中的属性设置级别高于框架设置文档中的属性级别, 如果在框架设置中指定框架的边界为零,而在分框架中指定有边界,则最后显示的分框架是有边界的。

 87. 框架的命名

 每个框架的命名也是很重要,许多网友喜欢打开多个浏览器同时浏览,有时会出现这样的情况,在一个网站中单击一个框架中的链接时,主框架没有任何改变,而在另一个网站的主框架中显示出链接的内容。其主要原因就是这两个网站的主框架都取胜同样的名称,所以最好为自己的每个框架取一个和其他网站不易重复的名字。

 88. “目标”下拉列表中有四个预设选项

 _blank 会打开一个浏览窗口来显示链接内容;_parent 会在当前框架的父框架中打开链接;_self在当前框架打开链接,这也是默认方式;_top 会在当前浏览器的最外层打开链接。

  89.

 IFrame 标签的使用格式

 src:文件的路径,既可以是 HTML 文件,也可以是文本、ASP 等。width,height:IFrame 框架的宽度与高度。

 scrolling:当 src 的指定 HTML 文件在指定的区域显示不完时,如果设置为 no,则不出现滚动条;如为 auto,则自动出现滚动条;如为 yes,则显示滚动条。

 Frameborder:IFrame 框架的边框宽度,为了与邻近的内容相融合,常设置为 0。

 90. 框架内容和无框架内容的查看

 尽管框架内容和无框架内容是分开编辑的,它们依旧同属于一个网页,可以通过框架设置文档的 HTML 代码看到,它们分别位于<frameset>和<noframe>标签中。

 91. 手工编写 CSS

 虽然用 Dreamweaver 可以可视化地编写 CSS,为了能够更好的撑握 CSS 样式表,建议读者在熟练的掌握了可视化编写 CSS 样式表后,可以手动的编写 CSS 样式表代码。

 92.

 CSS 文件的位置

 CSS 可以位于网站的任何位置,只要在链接时能正确指出。出于方例性考虑,一般 CSS 文件都在网站的根目录下。

 93.

 CSS 语法

 CSS 定义一般是由标签、大括号构成,其中大括号中放置此标签的属性。一般用“标签属性:属性数值”来表示,如果有几个不同的属性,中间用分号隔开。在颜色属怀中有时用关键字,例如 red,有时用十六进制数数值,如#DDDDDD。这些都被浏览器支持。颜色还有另外两种表现方法:一种用(RRR,GGG,BBB)

 ,例如黄色是:(255,255,0)

 。另一种是用(R%,G%,B%)

 。推荐使用十六进制颜色表示方式。

 94.

 pfr 文件

 Pfr(Portable Font Resource 便携字体源)是一种可以支持 Navigator 与 IE 的可下载字体(IE 需要一个控件支持)

 。利用 Typograph 和 WebFont Maker 都可以生成这种字体,同时,也可以在互联网上下载一些免费的特效字体。

 95. 中文限制

 令人遗憾的是,很少有中文的 pfr 文件提供下载,而且中文字体一般都在 1M 以上,也很难做到动态下载,看来如果想使用中文的动态字体还有待于网络速度的提高。

 96. MIME

 如果你是一名网管,对 MIME 一定不会陌生。MIME 可以理解为网上的文件关联,如果一个扩展名没有在 MIME 中设置,即使浏览者拥有打开此文件的软件,它依旧只能下载到客户机,反之,它就可以直接被打开。

 97.

 JavaScript 的应用

 JavaScript 在 Web 上的应用非常广泛,几乎在任何中型以上的站点都会用到它。总的来说,JavaScript 常用于以下情况:交互式导航、简单的数据搜寻、表单验证、网页特效、交互式教育或游戏等等。

 98.

 JavaScript 与 Java

  JavaScript 与 Java 是两种不同的语言。JavaScript 的开发公司是 Netscape,是一种解释性脚本语句,应用范围仅限于 Web。Java 是由 Sun 公司开始的一种全新的跨平台语言,和 C 类似,是编译性语言,应用范围不仅仅限于 Web,可能广泛应用于应用程序开发。

 两者之所以经常混淆,是因为 Netscape 为了占领脚本语言市场,在得到 Sun 公司的允许下把自己的脚本语言加上了个时髦的“Java”。

 99.

 JavaScript 函数的位置

 JavaScript 函数可以位于 HTML 的<head>与<body>区,为了减少出错以及增强可读性,一般把函数放在<head>区中。

 100. 面向对象的编程

 面向对象的编程现在已经不是一个新名词了,几乎所有的语言都宣称是面向对象的,JavaScript也是这样。面向对象编程最基本的特征就是对象、属性和方法。

 101. HTML 标签样式和组合样式

 选择“重定义 HTML”标签选项,可以直接定义 HTML 语言中各种标签的样式,样式一经定

 义就在整个 HTML 文件中通用。选择“使用 CSS 选择器”选项,可以定义组合样式(两个或两个以上 CSS 元素组合)以及具有特殊序列号(ID)的样式元素。Dreamweaver 提供了四种给定的组合样式,分别是激活的链接 a:active;当前链接 a:hover;链接 a:link;访问过的链接a:visited;通过对这几个元素的定义可以在网页中非常方便地实现简单的链接交互效果。

 102. 使用标签选择器应用样式

 为了更准确地选取要应用样式的页面元素,可以使用标签选择器选中元素,单击鼠标右键,在右键菜单中的“设置类”子菜单中选择要应用的样式。

 103. 标签中的样式表

 在<body>标签中的内容应用样式表,包括子标签,例如<p>、<center>和<div>等,但对于<Hx>的标题标签和<table>、<td>的表格标签例外。

 104. 复制样式表

 一般来说,复制的样式表应为自定义的样式,当所需要的样式表与自定义的样式表在大部分样式上相同时,可以复制自定义的样式表,然后再加以修改得到需要的样式表。而复制重新定义的标签和利用标签选择器创建的样式,因为定义的目标已明确了,所以复制无太大的意义。

 105. 制作一个动态链接效果

 目前,在大多数国内的网站中为了增加网页的美观,应用较多这种基于文字超链接的动态链接效果。这种效果的原理是定义了超链接的四种状态:

 a:link、 a:active、 a:hover、 a:visited, 并对这四种状态的样式进行不同的定义,这样在网页中当超链接处于不同的四种状态时,就 有不同的样式,从而形成了动态的效果。

 106. 常用的一些属性值及说明

 字体:通常选择“宋体” 。字体大小:设置为 9pt 和 12pt 的中文较为常见。样式:当字较小时,字体的粗细有一定限度。样式:包括正常、斜体和偏斜体三个选项,但中文表现似乎并不明显。大小写:包括首字母大写、大写、小写和无四个选项,可设置每个英文单词的首字母大写,或将全部单词设置为大写或小写。修饰:这是 CSS 的一个十分有用的效果,包括下划线,上划线,删除线,闪烁及无五个选项。

 107. 动态链接效果

 在不应用样式表的情况下,网页中的链接是静态的,在 IE4 及高级版本中可以在浏览器的设置中设置链接的动态效果,当然这种动态效果是有效的,只能定义下划线状态,其功能远远不如样式表的功能强大。在样式表中不但可以定义下划线,还可以定义颜色、字体样式和背景等许多样式。不过不用担心当浏览器对链接的效果进行设置后与样式表有冲突,浏览器总是以样式表为准。

 108. AP 元素的标签

 默认情况下,插入 AP Div 的标签是 div,这个标签与 IE 与 Navigator 中都受支持,并且被 W3C 所接受,通常不需要对它进行改变。如果想进行改动,可以在 AP

 Div 的“属性”面板中的“标签”下拉列表中进行选择。

 109. AP Div 的关系

 如果两个 AP Div 有交叉,它们可以有两种关系:重叠与嵌套。重叠就是这两个 AP Div 是独立的, 任可一个 AP Div 改变时,不影响另外一个层;而嵌套时子 AP Div 会随着母 AP Div 的某些属性的变化(例如位置移动)而变化,而母 AP Div 不随子 AP Div 发生变化。

 110. 建立一个完全处于母 AP Div 之外的子 AP Div

 如果想建立一个完全处于母 AP Div 之外的子 AP Div,不能通过直接在母 AP Div 之外建子 AP Div 的方法进行,而是要首先在母 AP Div 内建立一个子 AP Div,然后将子 AP Div 移动到母 AP Div 外面。

 111. 用另一种方法建立嵌套 AP Div

 在建立好第一个 AP Div 后, 拖动 “常用” 选项卡上的“绘制 AP Div” 按钮到这个 AP Div 中,则新 AP Div 就为了老 AP Div 的子 AP Div。

 112. 比较 AP Div 的重叠与嵌套的区别

 为了进一步比较 AP Div 的重叠与嵌套的区别,可以先建立两个重叠的 AP Div,再建立两个嵌套的 AP Div,然后分别移动各个 AP Div,观察另外一个 AP Div 的变化情况。

 113. 应用 Alt 键

 如果在“首选项”对话框中,选中了“如果在 AP Div 中则使用嵌套”复选框,那么当新建的AP Div 与上次建的 AP Div 有交叉时,新 AP Div 自动成为原 AP Div 的子 AP Div。此时如果想让它和原 AP Div 成为并列关系,可以先按下 Alt 键,再绘制 AP Div。当然,如果该复选框没有被选中,按下 Alt 键后绘制的 AP Div,和原 AP Div 就由并列关系变为嵌套关系。

 114. AP Div 的命名

 AP Div 的命名并不是随意的,为了避免出错,需要掌握 AP Div 的命名规则:不能用非英文字母的字符开头,例如 1apDiv,-apDiv 等;不要使用特殊字符或空格,例如 apDiv-1,apDiv*1,apDiv 1 等,这些命名中包含“-” 、 “*” 、空格等特别字符,Netscape 的浏览器不能正确处理这样的 AP Div,很容易因为不能正确安排这些 AP Div 而报错;给网页中的每个元素都取不同的名字,当 AP Div 的名字和网页中元素的名字例如图像的名字一样时,浏览器就有可能会报错。

 115. 给 AP Div 分配一个大的 Z 值

 在通常情况下,如果想让一个 AP Div 永远在上面,不被其他 AP Div 覆盖,可以给它一个很大的 Z 值,例如 1000,而将其他有可能重叠的 AP Div 的 Z 值设置为 100 之内的数。

 116. AP Div 中的特殊对象

 如果 AP Div 中包含了一些特殊对象,例如 Java Applet 和 ActiveX 控件,则这些元素有可能忽略 AP Div 的“Z 轴”属性,而直接显示到最上面的 AP Div 中。所以当在 AP Div 中应用这些元素时,一定要先做测试,或者将他们放到最上面的 AP Div 中。

 117. 避免 AP Div 的重叠

 如果需要画几个距离很近的 AP Div,而又不希望这些 AP Div 之间出现重叠,可以执行“修改>排列顺序>防止 AP

 Div 交迭”菜单命令。反之,当发现 AP

 Div 之间不能重叠时,将此项的勾选去掉即可。

 118. Dreamweaver 对 AP Div“溢出”选项的默认显示方式

 Dreamweaver 在编辑状态时并不能正确显示 AP

 Div 的 4 种“溢出”显示方式,而是全部采用 visible 的方式,如果想要看到正确的浏览效果,一定需要通过浏览器验证。

 119. 浏览器对“溢出”的支持

 IE 对“溢出”的支持要远远好过 Netscape, 4 种情况都可以在 IE 中正常显示, 而在 Netscape 中,只有 visible 的情况是正常的,其他 3 种情况都不能被正确显示。

 120. 用嵌套 AP Div 来准确定位需要剪辑的坐标

 之所以可以用嵌套 AP Div 来准确定位需要剪辑的坐标, 是因为嵌套 AP Div 的坐标是相对于母 AP Div 左上角的相对坐标,这与剪辑的坐标恰好一样。子 AP Div 坐标加上宽和高,就是剪辑的最右(R)和最下(B)的坐标。

 121. 巧用 AP Div 的剪辑

 可以先将 AP Div 的一部分显示出来,例如剪辑区是一道习题的题目部分,当预设的条件满足时,可以将整个 AP Div 显示出来,如以前隐藏的习题的答案部分。

 122. 为什么要使用“AP

 元素”面板

 虽然“AP 元素”面板提供的功能可以在其他地方找到,我们还是强烈推荐大家在使用 AP

 Div的时候将“AP 元素”面板打开。它可以将所有的 AP

 Div 都列出来,无论 AP

 Div 是否可见;而且可以将 AP Div 的关系(包括并列和嵌套)直观地表现出来;不仅如此,在这里修改它们的关系或单个 AP Div 的属性都很方便。

 123. 利用“AP

 元素”面板删除 AP Div

 利用“AP 元素”面板可以很简单地进行 AP Div 的删除操作,在“AP 元素”面板中任选一个AP Div,按 Delete 键即可。

 124. 利用“AP

 元素”面板进行 AP Div 的选择

 利用“AP 元素” 面板的好处之一就是可以方便地选择所需要的 AP Div, 特别是某 AP Div 不可见,或者被其他 AP Div 完全盖住时,没有“AP 元素”面板几乎无法选择该 AP Div。

 125. AP Div 的可见性

 AP

 Div 的可见性有三个数值:visible,hidden,inherit。分别对应于眼睛睁开、眼睛闭上、没有眼睛。Inherit 的含义有两个:一是保持原来 AP Div 的状态,如果原来的状态没有则是可见的;一是如果此 AP Div 是子 AP Div,则继承母 AP Div 的可见性。

 126. 嵌套后子 AP Div 的位置

 在一个 AP Div 成为子 AP Div 后,字和母 AP Div 的位置关系一般会发生变化,因为嵌套后它与母 AP Div 的位置关系等于它原来与浏览器的位置关系。

 127. AP Div 的嵌套使用限制

 AP Div 的嵌套虽然带来了很多好处,尤其是在浏览窗口大小经常改变时,使用 AP Div 的嵌套可以达到相对定位的目的。但建议尽量少用,理由很简单,Netscape 浏览器不能很好地处理嵌

 套 AP Div,事实上几乎只要使用嵌套就会显示出错。

 128. 使用 AP Div 标签进行嵌套

 首先保证在 Dreamweaver 参数的不可见元素标签中,AP

 Div 的标签是勾选状态,选中子 AP Div 的标签,将它拖到母 AP Div 中,就和母 AP Div 建立了嵌套关系。

 129. 利用标尺查看网页中任一点的坐标

 当标尺出现后,在编辑区移动鼠标时,仔细观察两个坐标轴,会发现各有一条灰线在移动,当鼠标停留在任一点时,灰线所在的数值即为此点的坐标。

 130. 网格菜单选项与“网格设置”对话框的对应

 在“查看”菜单下的“网格”子菜单中有两个选项:

 “显示网格”和“靠齐到网格”,它们与“网格设置”对话框中的“显示网格”和“靠齐到网格”复选框相对应,如果有一处被选定,对应的另一处也被选定。

 131. 用网格与 AP Div 定位网页元素

 Dreamweaver 中的网格捕捉步长默认为 10 个像素,并且无法更改。因此,如果想准确且快速定位,最好将网格的间隔也设为 10 个像素,这样 AP Div 的位置就只出现在各网格接点处,然后再在 AP Div 上插入各种元素,就完成了网页元素的快速而准确的定位。

 132. AP Div 与表格的转换

 网页中的 AP Div 如果有重叠则不能进行转化为表格的操作。

 133. AP Div 转换为表格的参数设置

 选择“最精确”选项,将采取尽可能精确的方式进行转换;选择“最小”选项,在转换时可忽略几个像不比内的误差; “使用透明 GIF”复选框指是用透明的 GIF 填充表的最后一行,这将确保该表在所有浏览器中以相同的列宽显示; “置于页面中央”复选框是指转换后 的表格是否自动居中。

 134. 行为

 行为可以理解为网页执行的某个动作,它可以在某个对象满足某个条件的情况下触发。例如一个跳转按钮的行为的作用对象就是这个按钮自身,满足的条件就是鼠标的左键按下,执行的行为就是跳转。

 135. 成对出现的行为

 可以看到在“行为”面板中有两上行为——“交换图像”和“恢复交换图像”,很显然它们是成对出现的,前者表示变换图像,而后者表示恢复原来状态。在 Dreamweaver 中可能这样轻松地制作出动态的按钮和图像。

 136. “行为”面板介绍

 “添加动作”按钮 :为对象添加动作。“删除动作”按钮 :删除对象已存在的动作。

 “上/下移”按钮:调整动作的顺序。“事件” :修改动作的条件。“动作” :当事件发生时进行的动作。

 137. 错误信息的显示

 在网页预览时,浏览器将不显示明确的错误信息,而是在状态栏中有警告标志的图标,仅当出现严重的错误时才显示网页中有错误的字样。

 138. 改变<input>类型中的对象的属性

 要改变<input>类型中对象的属性,必须先加入<Form>标签。否则,在“命名对象”下拉列表中将无法找到对象。在加入<form>标签后,Dreamweaver 会先找到<form>对象,然后再确定要改变的对象。

 139. “检查浏览器”动作

 通常“检查浏览器”动作被指定到<body>标签,并使用 onload 事件。

 140. “检查插件”的操作

 检查插件后,“检查插件”将向拥有相应插件的访问者传送包含多媒体内容的网页,而将向那些没有安装相应插件的访问者传送一个提供下载插件服务的网页。

 141. 对 Shockwave 和 Flash 对象进行命名

 要对 Shockwave 和 Flash 对象进行命名,否则 Dreamweaver 会提示用户,如果不对对象命名则不能创建行为动作。

 142. 拖动 AP

 元素的设置

 在“拖动 AP 元素”对话框的“基本”选项卡中可以在“移动”下拉列表中选择“限制”选项,在后面会出现上下左右输入框,可以输入适当的数值,使 AP Div 在规定的范围内拖动。在“高级”选项卡中可以选择拖动 AP Div 的范围,当拖动时和拖动后调用 JavaScript。

  143. 跳转网页

 如果在网页中存在框架,可以选择在特定的框架中打开跳转的网页,同时也可以在“行为”面板中设定触发的事件。

 144. 跳转网页的设置

 在利用单击网络广告赚钱的情况下,可以利用<body>标签的事件来作弊。添加一个跳转网页的行为,将网页设置为正常的浏览网页,并将事件定义为 Onfocus,再定义一个跳转网页的行为,将网页设置为广告商的网页,并将事件定义为 Onblur,这时网页是在最小化或未被激活的状态,这样利用浏览者浏览其他网页的时间,不知不觉的进行链接。

 145. 使用 JavaScript 打开和控制窗口

 如果要使用 JavaScript 打开的控制窗口, 要为窗口取个名字, 并不能与其他的窗口重复。

  146. 定义弹出窗口

 以前要在网页定义在网页下载完成时弹出窗口,需要手工编写。在 Dreamweaver 中可能轻松地制作出弹出窗口,并可以对弹出的窗口样式进行设置,只需要添加“打开浏览器窗口”的行为即可完成操作。

 147. 播放声音

 在网页中可以使用 JavaScript 来播放声音, Dreamweaver 就是通过这种方式播放声音的。另外,在<body>的 bgsound 标签中可以定义网页的背景音乐,并只有在网页下载完毕时才可以开始播放, 比使用 JavaScript 来播放声音在触发方式上要单调。

 所以一般多使用 JavaScript 来播放声音。

 148. 弹出信息

 在网页中可以弹出信息,引起浏览者的注意,但是在一些不适合的网页中应用信息往往适得其反,会引起浏览者的反感。所以在正常情况下不要使用太多的弹出信息。

 149. 显示-隐藏 AP 元素

 在网页中要达到动态显示 AP Div 的效果, 首先要将每个 AP Div 的默认可视属性设置为“隐藏”。

 150. 命名的 AP Div

 在“显示-隐藏 AP 元素”对话框中显示了当前网页中的所有的 AP

 Div,在列表中选择 AP Div,单击相应的按钮可以显示和隐藏 AP Div。

 151. 向网页中置入文本

 Dreamweaver

 可以向网页中的框架、AP

 Div、状态栏和文本框中置入文本。这样在不同的事件发生时,可以向上面 4 个对象置入不同的文本,达到不同的效果。

 152. Window.location 和 new Date 函数

 Window.location 和 new Date 都是 JavaScript 内嵌函数, window.location 表示网页的地址,new Date 返回当前系统时间。在被调用时要使用大括号{}将函数括起来,以区分文本和函数。

  153. 表单元素

 在添加表单元素时,会提示是否加入<form>标签,因为制作跳转菜单用不到表单的处理,所以在制作跳转菜单时,可以不用插入<form>标签。

 154. 控制时间轴

 在控制时间轴之前,要先建立 AP Div,然后将 AP Div 添加到时间轴中,这样才能对时间轴进行控制。如果希望时间轴循环播放,要在建立时间轴时选择“循环”选项。因为要对时间轴进行控制,所以没有必要将时间轴设置为自动播放。

 155. 控制时间轴到特定的帧

 在网页中可以对时间轴进行控制,在设置窗口中填入指定的帧数,并且可以设置循环的次数。

 156. 时间轴的帧

 在网页中可以控制时间轴到特定的帧,同时可以在时间轴中对指定的帧进行编辑。但是如果指定的帧不是关键帧的话,要在将这个帧定义为关键帧后,才能对其进行编辑。使用过 Flash 的设计者可能对帧较为了解,时间轴的功能明显远不及 Flash。但是通过时间轴来实现网页的动态效果也是不错的选择,同时还不需要相关的插件。

 157. “检查表单”对话框中的“值”与“可接受”选项区

 在“值”选项区中选中“必需的”复选框,指定此栏必需填写,并在该项的后...

推荐访问:学习笔记 DW