Chikoo's Blog

1. 用Dreamweaver 4.0轻松设计会自动弹性调整的网页首先需要保证的是你的页面内容采用了表格的格式，然后打开你要编辑的页面，按“Ctrl+F6”或者菜单“View→TableView→Layout?View”转换到布局视图。这时可以看到单元格的列宽，在列宽数字的旁边还有一个小小的下拉式箭头，点击你要设定弹性显示的列上方的小箭头，接着选择“将列设为弹性显示”(Make Column Autostretch)。该列方框上方就会出现一条波浪形的线，而不是刚才表示列宽的数字。完成后你的页面就变成了一个具有弹性的页面了。此外，需要注意页面中不要有尺寸过大的图片。---------------2. 用Dreamweaver 4.0制作有闪动效果的Flash按钮选择菜单Insert→Interactive?Images→Flash?Button就可看到有哪些内嵌按钮。在弹出的对话框里，你可以在“Style”列表里选择自己想要的按钮样式，在预览(Sample)窗口里可以看到这种样式的效果如何。选择好之后，在“Button?Text”窗口输入按钮上面的文字，在“Font”窗口选择字体，在“Size”窗口输入文字的大小，在“Link”窗口输入链接的目标，在“Target”窗口选择链接打开的方式，在“BgColor”选择按钮背景颜色，在“Save?As”窗口输入保存的文件名。完成这些后，按下“OK”按钮，你就完成了一个Flash按钮啦。这个按钮还会自动插入你的网页中，然后在Dreamweaver编辑窗口选中你刚才制作的按钮，属性窗口就会显示出这个按钮的属性，单击上面的“Play”按钮，你就可直接在编辑窗口预览这个按钮的闪动效果。需要注意的是Dreamweaver?4.0的这个功能不支持中文字体。---------------3. 在Dreamweaver 4.0中自定义键盘快捷键选择菜单“Edit→Keyboard?Shortcuts”，在对话框中会列出目前已经启用的以及可以更改的快捷键一览表，你可以在这里把快捷键改成自己习惯用的。如果要更改快捷键，首先要选取你要更改的命令，接着选取目前的快捷键，这个快捷键就会出现在“Shortcuts”列表中，然后在“Press Key”窗口输入你想要使用的快捷键，然后点击“Change”按钮更改即可完毕。你还可以利用“+”、“-”按钮增加或者删除当前的快捷键。---------------4. 让Dreamweaver?4.0和Fireworks整合如果你的电脑里同时安装了Dreamweaver/Fireworks，那么你就可以使用Dreamweaver?4.0提供的整合Fireworks的功能。利用这个功能你可以把你的GIF图片修改得更加动人，轻松地实现动画效果。在Dreamweaver编辑窗口选择好你要修改的GIF图片，然后在图片属性窗口单击“编辑(Edit)”按钮，这时系统会自动启动Fireworks软件编辑这个图片。仔细看，你会发现Fireworks的图片编辑窗口已出现Editing?From?Dreamweaver这样的文字和图样，也就是说这个图片是为Dreamweaver页面进行图片编辑的。现在我们在Fireworks里选择要编辑的图片，选择菜单“Modify→Animate→Animate?Selection”。在弹出的窗口里设置动画的属性：选定动画的帧数、动画移动的方向、透明度等等。然后把修改好的文件导出即可。这样，在Dreamweaver编辑窗口会自动更新刚才修改好的文件，使你的页面图片动起来。---------------5. 巧用网站报告器在Dreamweaver?4.0里提供了一个网站报告器，利用这个网站报告器可以帮助你在你的网站众多文件中快速找到和修复错误。单击菜单“Site→Reports”即可启动报告器，选择你要检查的项目，然后单击“Run”按钮即可查出你网站上的一般问题。你也可以自己编写报告器来查出网站上的一些特殊问题 (一般问题通常是一些文本丢失或文档未命名) 。---------------6. 快速恢复多次操作在制作页面时，我们可能需要不停地修改页面，有时还要恢复过去的操作，我们可以使用“Edit”菜单里的“Undo”命令，可是这个命令每次只能恢复一次，如果我们需要恢复多次操作，那就要不停地“Undo”，实在太烦。在Dreamweaver?4.0里提供了一个History窗口，可以让我们轻松地恢复多次操作。在“Windows”菜单里选择“History”即可开启这个历史窗口。在这个窗口把你每一次的操作都保留下来了，利用窗口左边那个滑动指针，就可以不停地恢复，还可以撤销每一次操作，包括已经存盘的。而且还可以把这个历史纪录保存下来共享。---------------7. 隐藏浮动面板打开Dreamweaver，给人的第一印象是一堆浮动面板，往往弄得你眼花缭乱，虽然它可以拖开，但毕竟占据着本来就很有限的屏幕，若把它关闭了，等一下用它时又要去打开。其实你只要按一下F4键，所有浮动面板都不见，再按F4他们又都重现于屏幕上了。---------------8. 快速预览网页初学Dreamweaver，往往找不到预览菜单，不得不另外启动IE浏览器来预览网页的实际效果。其实Dreamweaver的预览菜单放到File菜单下了，要预览正在编辑的网页，按F12键就可以了，方便得很呢！而且还可设置在不同的浏览器中预览，在File菜单下的Preview in Browser中选择Edit Browser List就可选择不同的浏览器进行预览。以测试你的网页对不同浏览器的适应性。---------------9. 在HTML检示窗中显示行号和自动换行 虽然Dreamweaver的Behaviors是一个javascript小程序的巨集，许多实现特殊网页效果的javascript程序都不用动手编程，但有时需要编写一点小程序时，显示程序行号显得尤为必要，特别是在程序发生错误时，往往都有是提示在“XX行有错误”，若一行一行地去数行号不仅太累而且还容易数错，在FrontPage中老是为数错行号而烦恼。在Dreamweaver中可方便了，只要在HTML源代码检视器窗口中，选中“Line Numbers”（行号）复选框，则会在源代码检视器窗口中对每条HTML语句自动显示行号，一目了然。同样有时一行代码较长，只要在HTML源代码检视器窗口中，选中“Warp”（自动换行）复选框，则会激活窗口的自动换行特性，过长的代码会自动从窗口的边缘绕回。---------------10. 如何获得颜色的十六进制代码在设计网页时，有时要用到16进制的颜色代码，以前经常为这事头痛，在Dreamweaver中只要按属性面板上“bg”边上小方框右下角的小三角形，在弹出的颜色板上，鼠标指到哪儿，马上就能显示出相应颜色的16进制代码，真方便。---------------11. 制作背景音乐在Dreamweaver中插入背景音乐是非常容易实现的，这里介绍两种方法，由大家选择。（1）在页面不显眼的地方插入一空层 ，并在层内放入一个ActivX对象 ，双击该对象，在打开的对话框中选择一个MIDI音乐文件，然后在层对象属性面板中设定其可视性为“Hidden”，保存变动后按F12预览网页，听听是否有音乐声。（2）另一种方法是利用Dreamweaver的“Behaviors”行为编辑器 ，单击“＋”按钮，选择其中“Play Sound”选项，在弹出的对话框中选择一个音乐文件即可。自己动手试一试吧！---------------12. 让背景图不滚动与FrontPage不同，Dreamweaver中插入的背景图是会随文字滚动的。有的时候我们需要制作固定的背景图，怎么办呢？先定义一张背景图，按“F10”打开HTML源文件，找到定义背景图片的语句，例如background=″images/background.JPG″，在它的后面空一格加上一句bgproperties=″fixed″。预览一下，是不是有点小小的成就感。---------------13. 定义大小不变的文字为什么别人网页上的文字那么漂亮，不管你怎么按浏览器字体按钮上的大小，他们的字体尺寸都不会发生变化。其实他们使用了网页中的“CSS”样式表技术，在Dreamweaver中要实现这一功能是非常简单的。首先按“F7”或者选择“窗口”菜单中的“样式表”选项打开样式表编辑器，在窗口中单击鼠标右键选择“新建”，在弹出的对话框中输入需要定义的样式表名称，按“确定”，然后在列表中选择第一项“类型”，并给具体的文字属性定义参数（一般来说文字的大小在800×600的屏幕中选择10.5较为适宜），按“确定”后，定义好的样式表就出现了。选择网页编辑窗中的文本，单击新的样式表名，可以看到选中的文本发生的变化。预览一下，试试定义的文本字体尺寸还会不会随浏览器的选择字体大小而改变。---------------14. 插入Flash动画Macromedia公司的Flash动画因其具有交互性、传送速度快等特点，已逐渐成为网页制作的一项新武器，如果你的网页上能插入一段Flash动画，那么一定会使你的作品增色不少。在Dreamweaver中插入Flash制作的SWF格式动画十分容易，单击对象工具栏上的Flash徽标或单击的“媒体”下的“Flash”，就可以打开选择SWF动画文件的对话框了，选好文件后可在其属性面板中设定播放的参数，即大功告成。---------------15. 让表格给网页留白 在Dreamweaver的新网页上输入文字时，默认格式是顶天立地的，十分不美观。要避免这一缺憾其实很简单，只要大家用好表格工具就行了。具体做法是：在新页面上插入一张居中对齐的表格，为了能够使表格方便控制，最好设定奇数列，并且数值不要太大。这样在单元格内输入的文字就被限制在一个可以随意调整宽度的区域内，就不愁文字不听使唤了。---------------16. 改变状态栏提示文字一般情况下，当浏览器装入一个页面时，在其状态栏上显示的是该页面的地址名称，十分呆板。你有没有想过给浏览器的状态栏增加一点个性呢？如果有的话，那么请按照以下的步骤，定制自己喜欢的文字吧！首先打开“Behaviors”行为编辑窗，单击“＋”按钮，选择“Set Text Set”下的“Text Of Status Bar”选项，然后在方框中输入自己的文字，例如“欢迎来到我的主页”等，单击“确定”即可。---------------17. 整合的文本代码编辑器可视化网页编辑软件的最大不便之处就是很难对源代码进行编辑，更别说javascript了；不过Dreamweaver?将使你处理代码变得异常轻松。这个内建的文本代码编辑器主要的新功能是：自动缩排（可以一次选取多行进行缩排），?还可以进行符号的检测，如果在编写代码忘了一个“”，它将给出提示。在工具表中的下拉菜单会列出当前网页中所有自定义javascript函数，可让你在网页原代码中自由跳转，“原始码导航工具”可以让专业人士方便地处理javascript函数，在文本代码编辑器中输入javascript代码，系统将用不同的颜色来显示。---------------18. 在Dreamweaver中输入多个空格我们平时输入的空格是半角字符，在Dreamweaver中只能输入一个，要想输入多个空格只要输入全角空格就可以了。输入全角空格的方法是：打开中文输入法，按Shift+Space切换到全角状态。这时你输入的空格就是全角空格了。---------------19. 解决Dreamweaver的BUG之一在Dreamweaver 3.0中行为面板（Behavior inspector）中，“Events for”下拉菜单项无法打开。这样一来，很多特技效果形同虚设，根本没法制作。其实这应该算Dreamweaver 3.0和中文Windows98不兼容的一个地方吧，在英文Windows98中就没有这个问题。而实际上这个菜单还是可以打开的，只不过是不能正确显示罢了。在选中下拉菜单后，我们可以用上下键来选择我们想要用的浏览器。---------------20. 用Dreamweaver 3.0的模版制作网页，设置行为（Behavior）在使用模板（Template）做出來的网页中不能新增行为。这是因为新增行为需要在HTML文件的Head部分之中插入javascript，而使用了Template后，HTML文件的Head部分会被“封锁”住。如果要在使用模板生成的网页中应用行为，你就需要事先在模板中定义好行为，然后把它定义为模板的可编辑区域。随后，你就可以在网页中更改这个行为了。但这也只限于更改行为的触发事件（events）和动作（actions）的具体内容，而不能更改动作的类型。---------------21. 给文字施加行为（Behavior），制作动态文字特效在Dreamweaver中普通的文字是以字符为单位的，不能作为对象，即一些非常有用的javascript事件不能赋予文字。因为文字不像图片和其他控件有具体的“标记”，所以文字与很多特效失之交臂。为了给文字添加特效，只有把文字做成超链接来处理。这样文字就成为了对象，可以施加行为了。但是这样又带来了一些不需要的超链接属性，比如下划线，以及hover、visited等颜色变化。 要想单纯为文字添加特效，可以先把所想设置的文字做成超链接，然后再在它的上面添加行为，最后我们再把超链接转变为普通文字。具体的步骤如下：选中你想编辑的文字，在链接目标框里随便填入几个字符。选中这个链接，单击窗口（Windows）→行为（Behaviors），弹出行为面板。按下“+”添加你想要的行为，如play sound等。打开Dreamweaver的超文本编辑器，找到这个链接，把改为，把改为。最后把“href=...”删掉。保存此页。按F12预览一下。效果还不错吧！---------------*22. 精确定位网页中各个元素的位置精确定位网页中各个元素的位置有两种方法：使用表格或层。使用表格是目前比较通用的做法，具体方法是：先在网页中建立一个表格，注意表格的边框宽度应为０。然后再把各个元素按照你的要求放在各个表格单元之中。仔细调整表格单元的大小以及表格边框的位置，这时在表格单元中的元素也会随之移动位置。这样你就可以比较精确地定位网页中各个元素的位置了。使用表格的优点是通用，几乎各个版本的浏览器可以致支持表格。它的缺点是使用起来比较麻烦，需要仔细进行调整，而且定位不十分精确。层在网页中可以随意放置，因此我们可以使用层来进行精确定位。使用方法是，在网页中插入一个层，然后把你想要定位的元素放在层里，接着我们就可以把层放到所想要任何位置了。此外，你还可以借助标尺和网格进行精确的定位。因为层只在最新的浏览器中被支持，所以为了兼容旧的浏览器，我们可以把层转变为表格。方法是选择“修改(Modify)→版面布局模式(Layout Mode) →把层转化成表格(convert layers to table)”即可。注意这时的层不能有重叠，我们可以在插入层之前选择“查看(view) →防止层交错(prevent layer overlaps)”来避免层的重叠。一般来说转换后的页面可能会有一些变化，还需要我们手工进行调整。最后有一点要注意，在进行表格和层的相互转换时，最好不要在一个页面中同时使用层与表格，那样可能会把你的页面弄得一团糟。