HTML图片热区map area的用法(转)】的更多相关文章

<area>标记主要用于图像地图,通过该标记可以在图像地图中设定作用区域(又称为热点),这样当用户的鼠标移到指定的作用区域点击时,会自动链接到预先设定好的页面.其基本语法结构如下: <area class=type id=Value href=url alt=text shape=area-shape coods=value> shape和coords:是两个主要的参数,用于设定热点的形状和大小.其基本用法如下: <area shape="rect" co…
<area>标记主要用于图像地图,通过该标记可以在图像地图中设定作用区域(又称为热点),这样当用户的鼠标移到指定的作用区域点击时,会自动链接到预先设定好的页面.其基本语法结构如下: 1 <area 2     class=type 3     id=Value 4     href=url 5     alt=text 6     shape=area-shape 7     coods=value> shape和coords:是两个主要的参数,用于设定热点的形状和大小.其基本用法…
实例 <img src ="planets.gif" alt="Planets" usemap ="#planetmap" /> <map name="planetmap"> <area shape="rect" coords="0,0,110,260" href="sun.htm" alt="Sun" /> &…
<area>标记主要用于图像地图,通过该标记可以在图像地图中设定作用区域(又称为热点),这样当用户的鼠标移到指定的作用区域点击时,会自动链接到预先设定好的页面.其基本语法结构如下: 1 <area 2 class=type 3 id=Value 4 href=url 5 alt=text 6 shape=area-shape 7 coods=value> shape和coords:是两个主要的参数,用于设定热点的形状和大小.其基本用法如下: <area shape="…
默认a标签及其包含的html元素和map中的area(图片热区映射)在点击过后留有默认的蓝色边框,如下图 可以看到,蓝色的边框破坏了页面的整体美感,很多时候我们都是不需要的.通过设置相应的css可以去除点击过后的蓝色边框. map area { outline: none; } 效果如图,点击过后厌人的蓝色的边框不见了,页面也美美的了!…
在做自适应网页的时候,如果在图片中使用了热区map.图片可以通过样式实现:图片大小随页面变化,但是MAP中每个area的坐标并不能通过css直接实现自适应.这篇文章就介绍通过原生js来实现:MAP中每个area的坐标也随页面等比例的变化效果. map area 热区自适应的实现代码 html: <style> img{ display:block;max-width:1920;width: 100%;border: 0; } </style> <img src="s…
所谓图片热点链接就是为图片指定一个或多个区域以实现点击跳转到指定的页面.简单来说就是点击某一区域就能跳转到相应的页面,而无需点击整个图片才能跳转. 说到图片热点链接,我首先想到了map + area,当然了,可能还有其他方法也能实现. 以前只是知道有这个功能,但是具体如何实现却没有去真正的了解.由于工作需要,今天稍微了解了下,发现这个功能其实蛮实用的,尤其是在网页banner广告位中想实现点击指定区域或链接以实现跳转是非常有用的. 首先说下map,map的作用是定义一个图像映射.所谓图像映射,是…
原文地址:https://www.cnblogs.com/jf-67/p/8135004.html 所谓图片热点链接就是为图片指定一个或多个区域以实现点击跳转到指定的页面.简单来说就是点击某一区域就能跳转到相应的页面,而无需点击整个图片才能跳转. 说到图片热点链接,我首先想到了map + area,当然了,可能还有其他方法也能实现. 以前只是知道有这个功能,但是具体如何实现却没有去真正的了解.由于工作需要,今天稍微了解了下,发现这个功能其实蛮实用的,尤其是在网页banner广告位中想实现点击指定…
在图片上直接画出带超级链接热区元素map和area相信大家并不陌生,Dreamweaver等网页制作软件都有直接在图片上绘制带超级链接的热区工具,但是直接绘制的热区是不能随着图片自适应放大和缩小的,现在很多网页对浏览器分辨率兼容性要求很高,多数都是用的百分比来定义图片的尺寸,希望图片能随着分辨率的不同,显示设备的不同,自适应的显示最佳效果,这种情况下如何定义图片热区的尺寸可以随着图片一起变化呢? 这是我今天遇到的问题,问了百度个把小时也没有找到答案,忽悠人的错误答案也不少.热区的范围和坐标主要是…
说明:这里所说的"偏门"只是相对于本人而言,记录在此,加深印象.也希望有需要的朋友能获得些许收获! 1.空元素(void):没有内容的元素. 常见的有:<br>,<hr>(显示一条水平线),<input>,<link>,<meta>(描述文档内元数据,如描述,编码,作者,关键字): 不常见的有:<area>,<base>,<col>,<command>,<embed>…