下面介绍几种创建超链接的方法。
一、创建文字超链接
<a href="http://www.baike369.com">百科369</a>
查看代码效果:HTML4.01<a>(Anchor:锚)标签示例
在<a></a>标记中,href属性用来放置超链接的目标,这个目标可以是本机上的某个HTML文件,也可以是URL地址。<a></a>之间的内容称为超链接的名称。添加了链接后的文字有自己特殊的样式,以便和其他文字区分开,默认的链接样式是有下划线的蓝色文字。
二、设置文字链接的颜色
超链接可以通过在<body>标签中设置链接的颜色来表示链接是否已经点击。
<html> <head> <title>HTML4.01教程:创建超链接设置文字链接的颜色示例-baike369.com</title> </head> <body text="blue" alink="red" vlink="yellow" link="green"
> <p><a href="http://www.baike369.com">欢迎访问 www.baike369.com</a></p> </body> </html>
查看代码效果:HTML4.01教程:创建超链接设置文字链接的颜色示例
在<body>标签中(请参考HTML4.01<body>(Document Body:文档体)标签),有下面几个属性需要了解:
三、创建页面内的锚点链接
制作网页时,可能会出现内容过长的情况,而当用户浏览网页时就会很不方便。为了解决这个问题,我们可以创建页面内的锚点链接。
1. 创建同一页面内的锚点链接
首先创建一个向导链接,如:
<li><a href="#C1">第一章</a>
</li> <li><a href="#C2">第二章</a>
</li> <li><a href="#C3">第三章</a>
</li>
创建向导链接的格式如下:
<a href=#目标名称>链接名称</a>
表示网页应该跳到哪个目标名称的位置上。
其次创建一个目标位置,如:
<h2><a name="C1"></a>
第一章</h2> <p>本章讲解的内容是 ......</p> <h2><a name="C2"></a>
第二章</h2> <p>本章讲解的内容是 ......</p> <h2><a name="C3"></a>
第三章</h2> <p>本章讲解的内容是 ......</p>
创建目标位置的格式是:
<a name=目标名称></a>
注意:“#”属性的目标名称和“name”属性的目标名称要一致。
查看代码效果:HTML4.01<a>标签name属性示例
请参考HTML4.01<a>标签name属性。
2. 创建不同页面内的锚点链接
假设向导链接在1.html文件中,目标位置在2.html文件中,则可以这样写。
在1.html中:
<li><a href="2.html#C1">第六章</a>
</li>
在2.html中:
<h2><a name="C1"></a>
第六章</h2> <p>本章讲解的内容是 ......</p>
我们只要在“#”号前面加上路径和文件名即可。
四、创建图片的超链接
图片超链接的建立和文字超链接的建立基本类似,都是通过<a></a>标记来实现的。
<a href="http://www.baike369.com"><img src="/include/logo.gif" border="10" /></a>
查看代码效果:HTML4.01<img>标签border属性示例
上面的代码,给图片加入了border属性。在建立图片链接时,浏览器会自动在图片周围加上一个边框,就像在建立文字超链接时会自动加上下划线一样。如果要取消这个边框,只需设置“border=0”即可。
五、图片的热点区域
还有另外一种图片的超链接方式,就是图片的热点区域。所谓图片的热点区域就是将一个图片专门分割出一个链接区域,这就是热点。热点的链接,点的就是图片中的热点区域。
制作图片的热点区域需要用到<map>标签和<area>标签,还需要掌握它的制作步骤,参考如下:
六、在新窗口中显示链接页面
我们在浏览网页中,当点击链接的时候,所链接的页面仍然是在同一个窗口中显示。那么,使用<a>标签中的target属性可以在新窗口中显示链接页面。请阅读HTML4.01<a>标签target属性。
七、相关阅读