Dreamweaver网页设计你不知道的技巧.pdf

《Dreamweaver网页设计你不知道的技巧.pdf》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、Dreamweaver网页设计你不知道的技巧一、背景分析对想要在视觉化环境下制作复杂网页的专业网页制作者来说，Dreamweaver已经渐渐在网页编辑工具中展露头角，成为专业人士编写网页的最佳选择。根据Macromedia公司的调查，Dreamweaver目前已累积有超过七十万名的使用者，占有率在网页编辑工具中居冠，像“AdobeGoLive”和“NetObjectsFusion”等竞争者都被遥遥抛在后头。因此一般地预估Dreamweaver的使用群体将会持续的增加。在这种势不可挡的普及率席卷之下，可想而知Dreamwea

2、ver内置的功能可说是越来越多、越来越丰富、齐全。在这次我们的介绍中，就有新增一些功能提供网页制作者一些更快速的设计、更容易地编码及整合性更强的功能。事不宜迟，以下我们介绍如何善用Dreamweaver里的一些功能。以下密技共有十二项，可分成四个主题。分别是：设计网页页面(Dreamweaver里具有弹性的页面设计功能)、搭配Macromedia其它产品一起使用Dreamweaver(制作动画和图片不求人)、自订使用界面(享受个性化的使用经验)和最后的加入Dreamweaver扩充程序(在网页中载入扩充高级功能)。二、设计

3、网页页面的秘诀不管你是要运用HTML原始语法逐字逐字来编写网页，或是运用标准化窗口来进行网页的视觉设计，以下的小秘诀都可以派得上用场。秘诀1：让网页页面大小更有弹性有些网页开发者称以下要介绍的这种技巧为“liquid”，在这儿则把这种技巧叫做是“弹性延伸的技巧”。这是一种技巧，可在访客浏览器窗口大小改变时也随之调整网页页面大小，因此如果窗口过大就不会有空白处;窗口过小边缘就不会跑出上下移动的拉条。其实大多数简单的网页会自己随着浏览器窗口大小来调整页面大小，但是如果是网页里用到很多不同的框架及表格，网页页面大小就很难自动弹性

4、地调整。通常网页设计者会用混合运用固定宽度的框架，和GIF图片作为间隔来设计网页页面，这样一来不论是用InternetExplorer或是用NetscapeNavigator，页面大小都会固定而不会跑掉。用Dreamweaver4.0可以轻而易举的设计出会自动弹性调整的网页。要怎么做呢?★具体做法：用工具面板(Objectpalette)上的按钮打开网页，并且转换到“格式查看”(Layoutview)。这时可以看到文字方块的栏度，每一栏的方框上方中间还有一个小小的下拉式箭头，点选想要设置弹性显示的栏上方的小箭头，接着选择“

5、将栏设为弹性显示”(MakeColumnAutostretch)。(设置自动调整栏的宽度以一栏为限)这时该栏方框上方就会出现一条波浪形的线，而不是原本表示栏度的数字。Dreamweaver会自动制作出固定版面的空格图片，这个空白图片是以栏上方的两个长条形的空白表格表示，如此版面会自动被填充，才会完成弹性版面设置。(在第一次增加空白图片时会跳出一个对话框问你是否要使用内置图片，为求效果，我们建议你让Dreamweaver自动产生一个，不然就不用使用空白图片来填充版面。)秘诀2：创造个人调色板Dreamweaver新的“Ass

6、etspanel”(属性控制面板)是一种可以在编辑网站时根据文件格式，例如图片、样式等来管理文件的新工具。★具体做法：当你定义新站点时(点选SiteNewSite)，所有类型的物体会自动增加到“Assetpanel”里的适当表框中。这个新加入的“Assetspanel”属性控制面板里也有颜色框，储存你网站里所用到的所有色彩，包含文字的颜色、背景的颜色，以及超链接的颜色等。这是一个为使用者量身定做的网站导航颜色盘。只要启动“Assetspanel”(先选“Window”再点“Assets”)，接着点左方那个小小的色彩卷轴，就

7、可以看到你网站里各式各样的颜色选项。当然你可以将这些颜色拉到某些特定选取的文字中。甚至当你选择某种颜色时，画面上会出现这种颜色的十六进位值的色彩淡浓度，和三原色对照码(RGB)。如果想将调色板工具栏缩小一点，甚至可以仅加入某些颜色到调色板的“我的最爱”里。只需将选取的颜色反白、点选窗口里一个叫做“新增到我的最爱的”按钮(最下方靠右的按钮)，就可以完成了。秘诀3：制作弹出式菜单导航系统原本要制作弹出式菜单导航系统(Pop-upMenuNavigationSystem)要用到很多的一些javascript的语法和技巧，但是如果

8、你有Dreamweaver、FireworksStudio，即可轻轻松松快速办到。★具体做法：首先在“Fireworks”里开始，选择某个图片，然后在“SetPop-UpMenu”的对话框里点选“InsertPop-UpMenu”，你可以输入项目(items)的名称并点“Plus”(加入)按钮，来新增该