使网页随浏览器伸展

Author: 小六 Date: 2001年 18期

?牐牴ノ颐浅1籇reamweaver的表格自动伸缩搞得头痛不已,对Fontpage能够随意画表格感到羡慕。但现在在Dreamweaver4中,这一切都变得非常简单。
  ?牐燚reamweaver4提供了两种视图,布局视图和标准视图。如果你认为你已经能够控制Dreamweaver的表格,那么你可以在你熟悉的标准视图中工作;如果你很喜欢Fontpage的画表格功能,那么在布局视图中你可以随心所欲地做到这一点。而且在这个视图中你还能让你的网页某一部分固定,而另一部分自动伸展,这样无论你的浏览器窗口多大,都能使你的网页适合浏览器的窗口,而不发生变形。
  ?牐犎绻阌霉齧acromedia公司的另一个产品fireworks,你一定知道fireworks也能生成html文件。它总会产生一个像素的gif图片,这个图片是用以填充你表格的空白区域,使你的表格不会变形。现在Dreamweaver4也有了这项功能。它能自动生成一个名为spacer的gif图片来填充你的表格,使你的表格不会发生自动伸缩的现象。
  ?牐犎缃褚迪稚厦娴牧礁龉δ埽贒reamweaver4中已经非常简单。让我们先建立一个新站点,然后用熟悉的表格工具画一个1×3的表格,不用管它的宽度。因为,我们可以让它自动伸展适合浏览器窗口(当然你也可以直接在布局视图中画表格),然后,单击对象面板最底下的布局视图按钮,这时出现一个对话框。你不用担心,这只是简单的介绍布局视图中两个工具的使用等,按“ok”就切换到了布局视图(^18040702a^1)。
  ?牐犗衷诳幢砀褡笊辖怯幸桓雎躺膌ayout table标签,它代表你调用的这个表格。标签中有三个空白部分,每一个都标明了宽度且有一个小三角形。在这个表格中,假设我希望最左边的列固定,而整个表格适合浏览器的宽度。在Dreamweaver4之前,我们能将表格设为100%来使它适合浏览器的宽度,想要固定某个单元格却相当困难。但是现在你只需要决定表格中哪一部分是你想固定的,哪一部分是你想伸展的就行了。唯一要记住的是,我们只能让一列自动伸展!在这里,我决定将最右面的表格作为伸展列。
  ?牐犙≡褡詈笠涣校セ魉厦娴娜切伟磁ィ诔鱿衷诓说ブ醒≡駇ake column autostretch(^18040702b^2)。
  ?牐犛捎谑且桓鲂抡镜悖馐苯鱿忠桓龆曰翱颍崾灸阄四芄皇剐猩煺梗珼reamweaver需要放置一些spacer图片在另一些行里。下面有三个选项(图3)(^18040702c^):
  ?牐燙reate a spacer image:创建一个spacer图片。这个图片在浏览器窗口是不会显示出来的,它只是起着固定表格的作用。
  ?牐燯se an existing spacer image:利用存在的spacer图片。
  ?牐燚on’t use spacer images for autostretch:不利用spacer图片来做伸展,这样其它的行将会变形。
  ?牐牰杂谝丫ㄒ宓恼镜悖换岢鱿终飧龆曰翱颍闳钥梢岳肁dd Spacer Image增加spacer图片,现在我们选择第一个。在弹出的窗口中选择spacer图片的存放目录。好了,我们定义的自动伸展的列已经填充了我们的整个文档窗口,在浏览器中,它同样会自动伸展以适应整个浏览器的宽度。而我们剩下的两行被spacer图片填充并固定,在浏览器中它们也将保持同样的宽度。
  ?牐犗衷冢憧梢钥醇桓霾ɡ讼咴谡飧鲂猩希砹松煺沟牧小U飧霰砀裨醋鍪钡目矶仁?400,但现在由于设置了自动伸展列,蓝色的那一列自动放大,填满了整个文档窗口(^18040702d^4)。