用Dreamweaver MX建设神奇网页图片超链接

dreamweaver|链接|网页

大家在打开带有图片的网页时,有时会看到这样的情况:当鼠标指向图片的不同部位时,可以打开不同的超链接,这种技术我们称之为—网页图片热区。
  下面我们以Dreamweaver MX和FrontPage 2003为例,来看看网页图片热区的具体建立过程。

  一、在Dreamweaver MX中为图片建立热区

  1、启动Dreamweaver MX(其他版本请仿照操作),打开需要建立图片热区的网页文件,选中相应的图片,此时“属性”面板自动切换到“图片属性”状态(如图1)。

  2、选中一种热区类型(如“椭圆”),然后在图片上拖来出一个热区来(参见图1)


图1

  注意:热区相当于是在图片上增加了一个图形层,象调整图片一样,可以通过鼠标调整热区的大小和位置。

  3、在“链接”右边的方框中输入要链接的网址(如“http://www.yesky.com”);在“替代”后面的方框中输入一些说明字符(如“天极网”);按“目标”右边的下拉按钮,在随后出现的下拉列表中选择一种链接页面的打开方式(如需要让链接的页面在新窗口中打开,就选择“_blank”选项)。

  注意:“替代”方框中输入的字符,在以后浏览网页时,当鼠标指向该热区时,在页面上会显示出该字符(如图2)。


图2

 4、重复上述2、3步的操作,在图片的不同部位建立多个热区。

  二、在FrontPage2003中为图片建立热区

  1、启动FrontPage2003,打开需要建立图片热区的网页文件。

  2、执行“视图→工具栏→图片”命令,展开“图片”工具栏(如图3)


图3

  3、选中一种热区类型(如“长方形”),然后在图片上拖来出一个热区,此时系统自动弹出“插入超链接”对话框(如图4)。


图4

  4、在“地址”栏上输入要链接的网址(如“www.yesky.com”);点击“屏幕提示”按钮打开“设置屏幕超链接提示”对话框(如图5),输入一些说明字符(如“天极网”)。


图5

  注意:此处的“屏幕提示”同Dreamweaver MX“替代”功能一样。

  4、同理,重复上述3、4步的操作,可以在图片的不同部位建立多个热区。

时间: 2024-08-03 13:26:16

用Dreamweaver MX建设神奇网页图片超链接的相关文章

Dreamweaver MX建网页图片超链接

dreamweaver|链接|网页 下面我们以Dreamweaver MX和FrontPage 2003为例,来看看网页图片热区的具体建立过程.    一.在Dreamweaver MX中为图片建立热区     1.启动Dreamweaver MX(其他版本请仿照操作),打开需要建立图片热区的网页文件,选中相应的图片,此时"属性"面板自动切换到"图片属性"状态(如图1).     2.选中一种热区类型(如"椭圆"),然后在图片上拖来出一个热区来(

Dreamweaver MX 2004 新功能:图片处理

dreamweaver Dreaweaver MX 2004 中增加了图片处理功能,如图片亮度和对比度的调节.图片的锐化效果等等. 下面我们来一起详细了解Dreamweaver MX 2004在图片处理方面的改进. 在Dreamweaver MX 2004中导入一张图片,看看属性面板上对应的图片相关选项,我们会发现多了几个图标功能. 首先在图片大小设置栏旁边就多了一个带箭头的圆形的按钮图标,如图3,这是快速使图片还原到原始大小的工具.另外在原有的切换到 Fireworks 图标的旁边的一组图表之

如何在Dreamweaver MX中制作网页背景音乐

  本次教程就教大家如何在Dreamweaver中添加网页的背景音乐,喜欢的朋友可以围观学习咯! 效果说明 建立文件,循环插入要播放的音乐,便可制作出动感的背景音乐,而且是随机的.实际效果请浏览随书光盘中[源文件]下的对应文件. 创作想法 打开 Dreamweaver MX 2004 软件新建页面,再选择[行为]面板下的[ + ]选项插播音乐,设置参数.然后重复此操作 4 次,就可以随机播放背景音乐. 操作步骤 ( 1 )打开 Dreamweaver MX 2004 软件新建文件,并保存页面.

Dreamweaver让css制作网页图片半透明

  Ok,我们现在开始,前提是你得打开Dreamweaver 4,下面是设置步骤:没用过这个工具?晕!快下载一个吧. 1:在Dreamweaver 4中点windowàcss styles(或按键盘的shift+f11),调出css styles窗口. 2:在css styles窗口中,单击右下角的加号,弹出new style窗口.设置如图: 3:点ok,弹出一个大窗口style definition for .clarity,我们按照下图设置. 也许你已经注意到了Alpha(Opacity=?

Dreamweaver MX 2004制作网页的17个技巧

dreamweaver|技巧|网页 1.从外部文档中粘贴时,如果不想要其格式,只要文字,可以使用"Edit->paste as text"命令,而不要直接Ctrl+V. 2."Command->Add/Remove Netscape resize fix"是一个很有用的命令,它可以使在NC4.0中浏览页面时,改变窗口大小的时候页面不会花掉. 3.所有的head元素不可成为库组件,所有元素在被insert library时,其head关联属性被去掉,如st

Dreamweaver让css使网页图片半透明

  让我先通俗的介绍一下css,css不属于html,它属于html的辅助语言,在没有css之前,网页是静态的,但自从有了css 后,网页制作的历史就要重写了,css能给网页加入许多你想象不到的动态效果,这也是其中一点而已,因为css中有很多特效,例如我们今天讲的利用css使图片变透明. 也许你会问,GIF图片不是能透明吗?那干嘛还那么麻烦,嘿嘿,GIF是可以透明,但可以半透明么?那很明显是不行的,但css就可以.想学就跟我来. 如果是完全变透明,那么它的意义不大,重要的是它可以令图片半透明,嘿

DreamWeaver MX 2004专题

dreamweaver Dreamweaver MX 2004 CSS使用教程 [2005-03-06] 菜鸟学用Dreamweaver MX 2004行为教程 [2005-03-09] Dreamweaver MX 2004入门教程 [2005-03-11] Dreamweaver MX 2004从零开始教程 [2005-03-11] Dreamweaver MX 2004打造留言本详解 [2005-03-13] DreamweaverMX2004站点远程连接设置 [2005-02-25] 用

实战Dreamweaver MX技巧之超链接

在经过前面几个部分的操作之后,我们的网页已经图文并茂,具有相当的效果了,但是这对于网页来说还不够,为了网站中的众多网页能够成为一个有机的整体,必须将各个网页通过超链接方式联系起来,这样才能够让浏览者在不同的页面之间跳转.  一.链接图片和文字  为一些文字或者图片建立链接非常方便,只要用鼠标选中需要变成链接的图片或者文字,然后在属性面板的"Link"输入框中输入需要跳转的目标页面地址,或者按下输入框旁边的文件夹图标来选择需要跳转的文件.除此之外,Dreamweaver MX 2004还

Dreamweaver MX技巧之超链接

在经过前面几个部分的操作之后,我们的网页已经图文并茂,具有相当的效果了,但是这对于网页来说还不够,为了网站中的众多网页能够成为一个有机的整体,必须将各个网页通过超链接方式联系起来,这样才能够让浏览者在不同的页面之间跳转. 一.链接图片和文字 为一些文字或者图片建立链接非常方便,只要用鼠标选中需要变成链接的图片或者文字,然后在属性面板的"Link"输入框中输入需要跳转的目标页面地址,或者按下输入框旁边的文件夹图标来选择需要跳转的文件.除此之外,Dreamweaver MX 2004还提供