网站首页  注册会员  本站免费电影 留言板  繁體中文

 

您现在的位置: 陈鹏个人网站 >> 电脑应用 >> 网络应用 >> 网页制作 >> 正文
 

   
专 题 栏 目
相 关 文 章

图解Firefox 3.1版的私密
FireFox 3.0的新书签程序
PPS网络电视(PPStream)
Mozilla FireFox 3.5.1中
Mozilla FireFox V3.5 正
DirectShow漏洞来了 Z武
百无一用的一些雷人Fire
eMule Xtreme V7.2 fina
Webware100 傲游浏览器再
GreenBrowser新版本 4.9

 
用Dreamweaver描摹图像           
用Dreamweaver描摹图像
作者:陈鹏 文章来源:eNet 点击数: 更新时间:2009-9-12 9:03:14
 




 

Tracing Image(描摹图像)是在Dreamweaver 2.0中增加的功能,但是在介绍Dreamweaver 4.0时,我们仍然要提起它。要很好地理解某个陌生的东西,一个好的方法就是将它和类似的但却是已被人们所熟悉的东西做个深入而全方位的比较,所以,让我们看看它和我们通常所说的背景图像有哪些异同:
相同点:Tracing Image同背景图像一样是一幅存在于页面背景中的图像,我想这是它们惟一的相同之处了。

不同点:

1、Tracing Image不会被Dreamweaver平铺(对一个背景图像来说,如果图像尺寸小于页面的尺寸就会被平铺。)

2、可以指定Tracing Image的透明度。 3、Tracing Image只在Dreamweaver中可见,在浏览器中它会被忽略。

4、当Tracing Image在Dreamweaver中可见时,背景图像和背景颜色将变为不可见。但有个开关可以让你选择要显示Tracing Image还是背景图像。

下面是一个显示在文档窗口中的Tracing Image(见图1)。

做法如下:

1、首先,我们要制作一个模型图像。你可以用你喜欢的任何一种图像编辑应用程序来制作这个模型图像,只要你最终将其保存为GIF、JPG、JPEG或PNG格式就可以了。以后,我们将用这个模型图像来作为建立页面布局的向导。意思就是说,先设计并制作好一个已经图像化的页面布局,再将其作为Tracing Image放入页面中,然后照着这个图像化的布局描就行了,这对于整体规划复杂的页面布局很有好处。

请添加描述


图1


2、接下来,我要把这个做好的图像模型放入需要的页面中。选择“View →Tracing Image→Load”,将出现一个对话框,找到你的图像模型并选择它,然后点击[Select]。

3、Page Properties对话框将紧接着出现,通过拖动滑块指定图像的透明度(Transparent),然后点击[OK]。你可以在任何时候通过选择“Modify→Page Properties”,来选择另一个Tracing Image或改变当前Tracing Image的透明度。


热门推荐:apple/index.shtml">苹果专题时尚专题




4、图2是我将我的Tracing Image放入页面后的样子(我设置了透明度为70%)。


请添加描述


图2

5、装入Tracing Image后,观察了一下,总觉得这个Tracing Image似乎没有处于文档的中央,因此,我决定要调整一下位置。选择“View→Tracing Image→Adjust Position”。在弹出的对话框中输入X和Y轴的坐标值(默认位置为8,11),然后点击[OK]。

除了调整位置外,你还可以使用下列选项:

Show(显示)——用来隐藏和显示Tracing Image,当Tracing Image隐藏时,背景图像和背景颜色就可以显示出来了(当然是在你设置了它们的前提下)。

Align with Selection(同选项对齐)——可以让你将Tracing Image的左上角和某个你选中的对象的左上角对齐(需要先点选一个准备对齐的对象)。

Reset Position(复位)——可以把你的Tracing Image送回(X:0,Y:0)的位置。

6、既然我们已经有了放置好的Tracing Image,可以照着它来绘制布局了。点击对象调色板中的[Layer],拖放两个层分别覆盖Tracing Image中的绿色区域。

7、至此,你们可以看到,Tracing Image已经成功地辅助我完成了这个简单的布局,当然,Tracing Image完全可以胜任远比这复杂得多的页面布局任务。但我的工作还没有完成,我的设计是要在右边的大的层中放置一台数码摄像机的图片,而在左边的小的层中放置对这台摄像机的说明。分别在大层和小层中插入图片和输入文字后,页面看起来是这样的(见图3)。

请添加描述

图3

8、好了,所有的工作都已经做完了。让我们在浏览器中预览一下吧(见图4)。

请添加描述

图4

完全不用担心浏览器将如何看待Tracing Image,它在浏览器中既不会被显示,也不会被下载,它只能显示在Dreamweaver中.

热门推荐:apple/index.shtml">苹果专题时尚专题





文章录入:陈鹏    责任编辑:陈鹏 
  • 上一篇文章:

  • 下一篇文章:
  • 【字体: 】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口
     
     
     
     
     

    Copyright © 2007 - 2009 chenpeng123.com All Rights Reserved
    本站所有文章,软件等均来自网络收集,不代表本站观点,仅供学习和研究使用。如有侵犯您的版权,请联系我们,本站将立即删除。
    鲁ICP备07014697号
    你是本站第 位访客