网站首页/网页设计列表/内容

html图像热区链接

网页设计2023-06-15阅读
网页的本质就是超级文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。

【实例介绍】

html图像热区链接

          同一个图像的不同部分可以链接到不同的文档,这就是热区链接。要使图像特定部分成为超链接,就要在图像中设置“热区”,然后再创建链接,这样当鼠标移动到图像热区的时候会变成手的形状,当按下鼠标的时候,页面就跳转到或者打开设定的uRL。
         <map>定义一个客户端图像映射,图像映射(image.map)指带有可点击区域的一幅图像。<area>标签定义图像映射中的区域。<img>标签中的usemap属性与map元素的n锄e属性相关联,创建图像与映射之间的联系。

【基本语法】

【语法介绍】

【实例代码】

<img src="images/9956.jpg" alt="Planets" width="500" height="320" border="0" usemap="#planetmap" /> <map name="planetmap" id="planetmap2">   <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" />   <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" />   <area shape="rect" coords="456,82,475,139" href ="sun.html" alt="Sun" /><area shape="rect" coords="452,143,471,187" href="#"> <area shape="rect" coords="446,193,471,243" href="#"><area shape="rect" coords="442,254,466,298" href="#"></map> <map name="planetmap" id="planetmap">   <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" />   <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" />   <area shape="rect" coords="457,130,476,187" href ="sun.html" alt="Sun" /> </map>

【代码分析】

area元素永远嵌套在map元素内部,area元素可定义图像映射中的区域。<img>中的 usemap属性可引用<map>中的id或name属性,所以我们应同时向<map>添加id和name属性,如图所示。

图像热区链接运行效果

 【素材及源码下载】

请点击:html图像热区链接 下载本实例相关素材及源码

 


网站建设是一个广义的术语,涵盖了许多不同的技能和学科中所使用的生产和维护的网站。

……

相关阅读