欢迎来到合肥浪讯网络科技有限公司官网
  咨询服务热线:400-099-8848

剖析:Dreamweaver网页制造诀窍之一

发布时间:2020-03-23 文章来源:本站  浏览次数:2138

中心提示:介绍如何善用Dreamweaver里的一些功用,分别是:规划网页页面(Dreamweaver里具有弹性的页面规划功用)、搭配Macromedia其它产品一同运用Dreamweaver(制造动画和图片不求人)、自订运用界面(享用个性化的运用经验)和最终的参加Dreamweaver扩大程序(在网页中载入扩大

  一、布景剖析

  对想要在视觉化环境下制造复杂网页的专业网页制造者来说,Dreamweaver现已逐渐在网页修正东西中展露头角,成为专业人士编写网页的最佳挑选。

  根据Macromedia公司的调查,Dreamweaver现在已累积有超过七十万名的运用者,占有率在网页修正东西中居冠,像“Adobe GoLive”和“NetObjects Fusion”等竞争者都被遥遥抛在后头。因而一般地预估Dreamweaver的运用群体将会持续的添加。

  在这种势不可挡的普及率席卷之下,可想而知Dreamweaver内置的功用可说是越来越多、越来越丰富、齐全。在这次咱们的介绍中,就有新增一些功用供给网页制造者一些更快速的规划、更容易地编码及整合性更强的功用。

  刻不容缓,以下咱们介绍如何善用Dreamweaver里的一些功用。以下密技共有十二项,可分红四个主题。分别是:规划网页页面(Dreamweaver里具有弹性的页面规划功用)、搭配Macromedia其它产品一同运用Dreamweaver(制造动画和图片不求人)、自订运用界面(享用个性化的运用经验)和最终的参加Dreamweaver扩大程序(在网页中载入扩大高级功用 )。

  二、规划网页页面的诀窍

  不管你是要运用HTML原始语法逐字逐字来编写网页,或是运用规范化窗口来进行网页的视觉规划,以下的小诀窍都能够派得上用场。

  诀窍1:让网页页面巨细更有弹性

  有些网页开发者称以下要介绍的这种技巧为“liquid”,在这儿则把这种技巧叫做是“弹性延伸的技巧”。这是一种技巧,可在访客浏览器窗口巨细改动时也随之调整网页页面巨细,因而假如窗口过大就不会有空白处;窗口过小边缘就不会跑出上下移动的拉条。

  其实大多数简略的网页会自己随着浏览器窗口巨细来调整页面巨细,可是假如是网页里用到许多不同的框架及表格,网页页面巨细就很难主动弹性地调整。通常网页规划者会用混合运用固定宽度的框架,和GIF图片作为间隔来规划网页页面,这样一来不论是用Internet Explorer或是用Netscape Navigator,页面巨细都会固定而不会跑掉。用Dreamweaver 4.0能够轻而易举的规划出会主动弹性调整的网页。要怎么做呢?

  具体做法:用东西面板(Object palette)上的按钮翻开网页,而且转换到“格局检查”(Layout vIEw)。这时能够看到文字方块的栏度,每一栏的方框上方中间还有一个小小的下拉式箭头,点选想要设置弹性显现的栏上方的小箭头,接着挑选“将栏设为弹性显现”(Make Column Autostretch)。(设置主动调整栏的宽度以一栏为限)这时该栏方框上方就会呈现一条波浪形的线,而不是本来表示栏度的数字。

  Dreamweaver会主动制造出固定版面的空格图片,这个空白图片是以栏上方的两个长条形的空白表格表示,如此版面会主动被填充,才会完结弹性版面设置。(在第一次添加空白图片时会跳出一个对话框问你是否要运用内置图片,为求作用,咱们主张你让Dreamweaver主动产生一个,不然就不必运用空白图片来填充版面。)

  诀窍2:发明个人调色板

  Dreamweaver新的“Assets panel”(特点控制面板)是一种能够在修正网站时根据文件格局,例如图片、款式等来办理文件的新东西。

  具体做法:当你界说新站点时(点选Site New Site),一切类型的物体会主动添加到“Asset panel” 里的恰当表框中。这个新参加的“Assets panel”特点控制面板里也有色彩框,贮存你网站里所用到的一切色彩,包括文字的色彩、布景的色彩,以及超链接的色彩等。

  这是一个为运用者量身定做的网站导航色彩盘。只需启动“Assets panel”(先选 “Window”再点“Assets”),接着点左方那个小小的色彩卷轴,就能够看到你网站里各式各样的色彩选项。当然你能够将这些色彩拉到某些特定选取的文字中。乃至当你挑选某种色彩时,画面上会呈现这种色彩的十六进位值的色彩淡浓度,和三原色对照码(RGB)。

  假如想将调色板东西栏缩小一点,乃至能够仅参加某些色彩到调色板的“我的最爱”里。只需将选取的色彩反白、点选窗口里一个叫做“新增到我的最爱的”按钮(最下方靠右的按钮),就能够完结了。
  
  诀窍3:制造弹出式菜单导航系统
  
  本来要制造弹出式菜单导航系统(Pop-up Menu Navigation System)要用到许多的一些JavaScript的语法和技巧,可是假如你有Dreamweaver、Fireworks Studio,即可轻轻松松快速办到。

  具体做法:首先在“Fireworks”里开端,挑选某个图片,然后在“Set Pop-Up Menu”的对话框里点选“ Insert  Pop-Up Menu”,你能够输入项目(items)的称号并点“PLUS”(参加)按钮,来新增该项目。你能够持续在跳出来的信息框里进行细项设置,例如设置该项目所要用的文字及超链接,当然也能够新增子菜单,并重新安排下一层的设置。

  完结时,点选“Next”(下一步),持续设置各种参数值,例如色彩、字体等等。这时菜单完结后,既能够预览HTML语法,也可预览图象。再点“ Finish”(完结)。这时当鼠标移动到原来的图片时,会呈现菜单系统的内容一览。接着将制造好的文件导出时,“Fireworks”会主动生产出一切 Dreamweaver 需要用到的HTML、JavaScript,以及图象文件。

  诀窍4:让图片动起来

  假如你一起装置有Dreamweaver、Fireworks Studio,这两种软件搭配的完美程度将使你赞不绝口。即便你不是专业的图片规划者,在规划网页时也多多少少想把一些GIF图片修正得栩栩如生。Dreamweaver能够让你制造动画不求人。

  具体做法:在规范窗口里挑选要进行修正的图片,然后在“Property Inspector”里点选“修正”(Edit)。假如你装置的Dreamweaver里附有“Fireworks”,“Fireworks”就是Dreamweaver预设图片修正器,这时图片就会主动载入到“Fireworks”。(假如仔细看,你会发现Fireworks的画面会呈现“Editing From Dreamweaver”这样的文字和图样,指示你能够在Dreamweaver里进行图片修正。)

  好了,现在在“Fireworks”里点选要修正的图片,挑选“ Modify Animate Animate Selection”。 接下来完结“Animate dialog box”里的设置,选定动画的帧数,动画移动的方向、透明度等等设置。你也能够点选“Frames”东西设置移动速度,挑选“Object”面板来改动设置。

  要导出文件时,只需点选“ Optimize ”东西栏,在文件类型的地方挑选“Animated GIF”。完结今后,“Fireworks”就会主动将图片以最佳化设置导出,而且主动将 GIF 图片更新,还会在Dreamweaver里将更新过的图片显现出来。点选“File Preview in Browser”,这样就能够在浏览器里预览刚刚制造完结的心爱图片。

  诀窍5:让按钮有闪烁作用

  在Dreamweaver中,不必有Flashs,也能够制造有闪烁作用的Flash按钮物体。Dreamweaver内置有好几个 Flash按钮物体,能够制造好几个不同方式的按钮。

  具体做法:点选“Insert Interactive Images Flash Button”就可看到有那些内置按钮。在对话框内乃至能够用鼠标指到想要运用的按钮方式,然后看看在浏览器里的作用如何。

  用鼠标指针把要用的按钮方式选定,再依顺序输入参数,例如按钮上的文字、字形、色彩、超链接等,或是自设文件姓名。按下OK。接下来就会有一个“SWF”格局的文件产生,文件并会主动导入你的网页中。按一下这个做好的文件,会看到“Property Inspector”(特点明细)中会显现出文件的特点。将文件特点显现出来时,假如扩展文件特点明细表,会呈现“Play”(播映),点选之后能够不必翻开浏览器来预览按钮的闪烁作用。

  诀窍6:制造活动文字

  在网页中添加活动文字就像添加咱们刚刚介绍的Flash按钮相同简略。相同地,不必装置Flash,用 Dreamweaver供给的新功用就能够轻松办到。常用HTML语法写网页、没有互动式媒体经验的网页制造者也能够轻松制造出小巧的Flash方式的活动文字。这项新功用能够在不添加相兼容性费事的状况下为网页增加一些浏览上与访客的互动性。

  具体做法:点选“Insert Interactive Images Flash Text”,再将参数设置一一填入(例如要更改作用的文字、字形、字体色彩及字体巨细等等)。

上一条:剖析:Dreamweav...

下一条:网页规划三部曲之三:艺术...