通俗基础教程

Dreamweaver3完全教程(5)
全套教程打包下载

1.1.3 控制浮动面板
　　对象面板、启动面板、属性面板和可停靠浮动面板通常总称作"浮动面板"，它们浮动于文档窗口之上，您可以将输入焦点在文档和面板之间来回切换。
　　利用浮动面板来控制对页面的编写，而不是利用烦琐的对话框，这是Dreamweaver编辑网页中最令人称道的特性。在一些其他的网页编辑器，例如FrontPage中，经常需要打开一个对话框来设置各种属性，在关闭对话框后才能看到设置结果，而在Dreamweaver中通过在浮动面板中进行设置，直接就可以在文档窗口中看到结果，避免了中间过程，从而提高了工作效率。
　　熟悉微软系列应用程序的用户可能对Dreamweaver 3的浮动面板感觉很不习惯，实际上，Dreamweaver 3的浮动面板非常灵活，同时也更便于控制。
　　1.1.3.1 使用启动面板
　　启动面板主要用于快速启动相应的任务，或显示/隐藏相应的浮动面板，在状态行的右方有一个微型启动栏，它同启动面板上的按钮是一样的，如图1-5所示。

　　 　　图1-5 启动面板和微型启动栏的对应关系
　　启动面板上的按钮都是按下/弹起类型的按钮，也被称作切换按钮，换句话说，这些按钮可以保持被按下的状态。单击启动面板上的按钮，使之被按下，会激活相应的浮动面板窗口，再次单击其上的按钮，可以使之弹起，这会将相应的浮动面板窗口隐藏。
　　我们已经知道，在Dreamweaver的可停靠浮动面板中可以将多个浮动面板组合成选项卡的形式，如果在启动面板上单击这些选项卡对应的按钮，则会将相应的选项卡激活到最顶端，而在启动面板上弹起任何一个可停靠浮动面板选项卡对应的按钮，都会将整个可停靠浮动面板隐藏。

　　 　　图1-6 使用启动面板

　　例如，在默认状态下，HTML源代码检视器是一个单独形式的窗口，单击启动面板上的"HTML Source"（HTML源代码）按钮，可以激活HTML源代码检视器，显示当前编辑文档的源代码，再次单击该按钮，则可以重新隐藏HTML源代码检视器。在默认状态下，CSS样式浮动面板是"停靠"在可停靠浮动面板中的，它以一个选项卡的形式出现，则单击启动面板上的"CSS Styles"（CSS样式）按钮，即会将可停靠浮动面板上的CSS Styles选项卡激活到顶端，如图1-6所示。
　　默认状态下，启动面板是水平放置的，单击面板右下角"垂直放置"标记，可以将启动面板变为垂直放置，同时该"垂直放置"标记变为"水平放置"标记；在垂直状态下，单击面板右下角的"水平放置"标记，又可以恢复启动面板的水平状态，如图1-7所示。

　　 　　图1-7 改变启动面板的水平和垂直状态

　　1.1.3.2 使用对象面板
　　对象面板上包含一些按钮，在网页编辑过程中，通过单击这些按钮，可以往网页中添加相应的对象，如图像、表格、框架和各种其他媒体等。 　　对象面板的空间是有限的，为了能够充分利用有限的面板空间，针对不同类型的对象，对象面板采用了多层结构，将不同类型的对象按钮放置于不同的浮动面板层中。
　　单击对象面板上的向下箭头，会打开一个下拉菜单，显示对象面板上所包含对象的类型，默认状态下显示的是Common（常用）类型，如果从该下拉菜单中选择其他类型，则在对象面板上会显示相应类型的按钮，在图1-8中，左边的图显示了打开下拉菜单，选择Forms（表单）类型的情形，右边的图则显示了表单类型对象面板的内容。

　　 　　图1-8 在对象面板上选择对象类型

　　1.1.3.3 使用属性面板
　　属性面板主要用于显示在文档窗口中所选中元素的属性，并允许用户在属性面板中对元素属性直接进行修改，根据选中元素的不同，属性面板上的内容也不同。例如，当在文档窗口中选择文本时，属性面板会显示如图1-9所示的外观，而在文档窗口中选择图像时，属性面板会显示如图1-10所示的外观，

　　图1-9 选中文本时的属性面板

　　图1-10 选中图像时的属性面板

　　在属性面板的右下角，通常都有一个指向下方的三角形标记，如图1-11所示，单击该标记，可以展开属性面板，显示更多的属性设置内容，当属性面板被展开时，右下角的三角形标记变为指向上方，如图1-11所示单击该标记，又可以重新折叠属性面板，恢复原先的外观。图1-12显示了展开图像属性面板时的情形。

　　 　　
图1-11 属性面板的展开和折叠标记

　　
图1-12 展开的属性面板