您的位置:首页 > Web前端 > HTML

第12节 html创建热点区域 链接

2017-02-10 16:28 267 查看

热点区域链接

例如:

<html>
<head>
<title>使用文本建立超链接</title>
</head>
<body>
<!--内部特定目标跳转 将需要跳转的文字包起来-->
<p>实现特定<a href="https://www.baidu.com/">目标</a>跳转</p>
<!--实现图像超链接-->
<a href="http://www.csdn.net/"><img src="D:\温习网页\favicon.ico" width="100" height="100"></a>
<br/>
<!--电子邮件超链接-->
邮箱地址:<a href="http://mail.163.com/">123456789</a>@163.com
<br/>
<!--以新窗口显示链接页面  添加target属性值设置为_blank-->
以<a href="https://www.baidu.com/" target="_blank">新窗口方式打开一个网页
<br/>
<!--创建热点区域 难点是找准图像的坐标-->
<!--img图片标签 border是制定图片没有边框 usemap是指定使用图片的地图名
值必须加上#和地图的名字
map地图标签 name是地图的名字
area是区域属性
shape是区域的形状 rect矩形 circle椭圆 poly多边形
coords是坐标属性:
rect矩形(左上角x,y,右下角x,y)
circle椭圆(圆心x,y,半径r)
poly多边形(多边形个点的坐标)-->
<img src="D:\温习网页\bd_logo1_31bdc765.png" border="0" usemap="#Mapl">
<map name="Mapl">
<area shape="rect" coords="23,28,111,81" href="D:\温习网页\字体样式.html">
<area shape="circle" coords="187,57,33" href="D:\温习网页\字体样式.html">
<area shape="poly" coords="271,12,321,23,321,80,275,87,251,49" href="D:\温习网页\字体样式.html">
</map>
<body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: