如何制作超链接,网页制作超链接教程

如何制作超链接,网页制作超链接教程,第1张

如何制作超链接,网页制作超链接教程 一.普通链接首先,做一个普通的网页,并且在网页中插入一张图片。


代码入下:<html><head><meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ /><title>无标题文档</title></head><body><img src=”./test.jpg”></body></html>2.如何添加超链接呢?这就要用到<a>标签来完成。


那么,如何给图片添加超链接呢?只要把<img>标签放在<a>和</a>之间就可以了。


而a标签又有一个参数:href.该参数用来指定链接的地址,假设我们要链接到百度。


那么更改代码如下:<html><head><meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ /><title>无标题文档</title></head><body><a href=”http://www.baidu.com”><img src=”./test.jpg”></a></body></html>3.保存后点击该网页。


之后,点击网页上图片。


看,成功连接到了百度。


4.上诉步骤,有一个要点!href的值不能使www.baidu.com。


否则会出错。


必须要写绝对地址http://www.baidu.com才可以!二.热区链接上诉时最普通的链接方式,其实要有一种更高级的连接方法。


在HTML中,可以把图片划分为多个热点区域,然后让每一个热点区域分别链接到不同的地方!厉害吧!请看代码:<html><head><meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ /><title>无标题文档</title></head><body><img src=”./test.jpg” usemap=”#mymap”><map name=”mymap”><area shape=”rect” coords=”0,0,20,20″ href=”http://www.baidu.com” title=”梅园”><area shape=”rect” coords=”30,30,20,20″ href=”http://mail.163.com” target=”_blank” title=”a园”></map></body></html>下面来分析代码:1)<img src=”./test.jpg” usemap=”#mymap”>意思是,在该图片中,使用名为mymap的映射图像名称。


2)<map name=”mymap”>意思是,定义热区图像,名称为mymap3)<area shape=”rect” coords=”0,0,20,20″ href=”http://www.baidu.com” title=”梅园”>意思是,对map的一个热区点进行定义。


rect代表矩形,coords代表热区图标,href为需要连接的地址。


OK,剩下的语法都没什么好说的了。


接着,打开网页,可以发现,当把鼠标放在左上角的时候,鼠标会变成“手”的形状。


点击,变会进入相应的链接。


当然,下图标的并不太准确,但大概是这么个位置,供参考。


这里再补充一点:shape的取值可以有多个:1)rect:刚用了,代表矩形,他后面的坐标为4个,前两个为坐上坐标(x,y),后两个为右下坐标2)circle:圆形的坐标。


后面的坐标为3个。


前两个为圆形的坐标,最后一个为半径。


当然,还有许多其他的,就不列举了,所谓边越多,则坐标越多,不难理解吧。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/tougao/593561.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-04-13
下一篇 2022-04-13

发表评论

登录后才能评论

评论列表(0条)

保存