HTML 利用MAP创建图片中的链接的映射
2016-04-13 22:51
567 查看
<html>
<body>
<p>请点击图像上的星球,把它们放大。</p>
<img
src="/i/eg_planets.jpg"
border="0" usemap="#planetmap"
alt="Planets" />
<map name="planetmap" id="planetmap">
<area
shape="circle"
coords="180,139,14"
href ="/example/html/venus.html"
target ="_blank"
alt="Venus" />
<area
shape="circle"
coords="129,161,10"
href ="/example/html/mercur.html"
target ="_blank"
alt="Mercury" />
<area
shape="rect"
coords="0,0,110,260"
href ="/example/html/sun.html"
target ="_blank"
alt="Sun" />
</map>
<p><b>注释:</b>img 元素中的 "usemap" 属性引用 map 元素中的 "id" 或 "name" 属性(根据浏览器),所以我们同时向 map 元素添加了 "id" 和 "name" 属性。</p>
</body>
</html>
<body>
<p>请点击图像上的星球,把它们放大。</p>
<img
src="/i/eg_planets.jpg"
border="0" usemap="#planetmap"
alt="Planets" />
<map name="planetmap" id="planetmap">
<area
shape="circle"
coords="180,139,14"
href ="/example/html/venus.html"
target ="_blank"
alt="Venus" />
<area
shape="circle"
coords="129,161,10"
href ="/example/html/mercur.html"
target ="_blank"
alt="Mercury" />
<area
shape="rect"
coords="0,0,110,260"
href ="/example/html/sun.html"
target ="_blank"
alt="Sun" />
</map>
<p><b>注释:</b>img 元素中的 "usemap" 属性引用 map 元素中的 "id" 或 "name" 属性(根据浏览器),所以我们同时向 map 元素添加了 "id" 和 "name" 属性。</p>
</body>
</html>
相关文章推荐
- HTML简介
- HTML文档类型
- 页面开发辅助类—HtmlHelper初步了解
- HTML字符实体
- CSDN中Markdown编辑器支持的Html标记及属性
- 2016/04/13 ①html 中各种分割线------------------------------------------ ② 控制文字显示
- html frameset边框问题 去掉横条
- 制作网页---html拾遗
- innerHTML
- 使用Dreamweaver格式化HTML代码
- html学习之路——第一天(2)
- kindeditor在线文本编辑器过滤HTML的方法
- html盒子模型
- HTML 元素和有效的 DTD
- HTML 5 参考手册(Canvas)
- HTML 5 参考手册(视频/音频)
- html伪类选择器
- html网页使用单引号双引号 转义符
- html选择器
- html里name和id的区别