如何利用DW在一张图片中插入多个连接

时间:2024-10-14 11:09:46

1、一.首先先找一张图片,随便一张就可以了,然后要上传要图片空间里面去二 . 打开DW软件,会出现要你新建个站点的,点击取消就可以

如何利用DW在一张图片中插入多个连接

2、三.点击下图红框内的HTML

如何利用DW在一张图片中插入多个连接

3、四.讲里面的代码删除掉

如何利用DW在一张图片中插入多个连接

4、五.点击设计,在代码右边第2个

如何利用DW在一张图片中插入多个连接

5、六.鼠标移到“插入记录”,会出现下拉框,点击“图像”,出现如图所示,选取所要添加链接的图片,点击确定

如何利用DW在一张图片中插入多个连接

6、七.确定之后会出现一个对话框,点击如下图

如何利用DW在一张图片中插入多个连接
如何利用DW在一张图片中插入多个连接

7、八.确定之后会出现自己所添加的图片

如何利用DW在一张图片中插入多个连接

8、九.单击图片,在左下角会看3个“热点工具”,分别为矩形,圆形和多边形热点工具,如下图

如何利用DW在一张图片中插入多个连接

9、十.随便选取一个热点工具,我选的是矩形工具,点击矩形工具,将鼠标移到到图片上的时候就会出现个十字形的标志,出现就证明你已经点击了矩形工具了,然后圈选你所要加入链接的地区,如果圈选错误的话,点击圈选错误的地区,按ESC或Delete(删除)就可以了,有一点要记住的是,在弄热点工具在图片上进行圈选的时候,千万不能互相重合交叉在一起,不然会出现链接错乱等现象!如下图

如何利用DW在一张图片中插入多个连接

10、十一.圈选后下面的属性框就会改变,如下

如何利用DW在一张图片中插入多个连接

11、十二.如果下面的属性框不是上面所示的话,再次点击下你所圈选的区域就会有了十三.接下来是加链接,如下图,在属性框上可以看到一个“#”字,把“#”字删掉,然后把你所要加入的链接复制上去,比如http://www.taobao.com,加链接的时候,记住一定要有http://www.这个为开头,链接才会生效。如下图所示

如何利用DW在一张图片中插入多个连接

12、十四.接下来大家可以看到在链接下面有个“目标”,点击下拉框,选择第一个“blank”是新窗口打开的意思

如何利用DW在一张图片中插入多个连接
如何利用DW在一张图片中插入多个连接

13、十五.以上步骤做好后,点击左上角的代码

如何利用DW在一张图片中插入多个连接

14、十六.之前上传到图片空间的图片终于派上用场了,打开图片空间,找到上传的那张图片,点击链接,如下图

如何利用DW在一张图片中插入多个连接

15、十七.回到DW软件,替换所圈选的图片地址,如下图,替换前 (图一)替换后(图二)

如何利用DW在一张图片中插入多个连接
如何利用DW在一张图片中插入多个连接

16、十八.弄好之后,可以按F12预览,不过要点击保存才预览的,默认预览的是IE浏览器,预览的时候红框内的地方有出现个橙色的对话框,直接右击对话框,选择第一个就可以

如何利用DW在一张图片中插入多个连接

17、十九,确认无误后,将代码全部复制到店铺里面的自定义区域的源码里面就可以了,相信这个大家都会吧!

如何利用DW在一张图片中插入多个连接
© 手抄报圈