HTML中<area>标签，做响应式网站的疑问。

不会的，首先你应该知道<area>这个标签是通过点的链接来确定一个图形的，这个点的位置肯定是不变的，在放大或缩小页面的时候只是把背景变大了，但是点的位置是没变的，也就是说这个会出现相应的偏移，但是不会出现不重合的问题。希望我的回答能解决您的问题，未解决请追问，解决请采纳，谢谢。。。

function inArea(img){

var id = '_$area$_', pos = this.coords.split(','), area = document.getElementById(id)

if (area) outArea(area)

area = document.createElement('a')

area.id = id, area.href = this.href, area.target = this.target, area._area = this

pos[0] -= 0, pos[1] -= 0, pos[2] -= pos[0], pos[3] -= pos[1]

with (area.style) {

position = 'absolute'

left = img.offsetLeft + pos[0] - 1

top = img.offsetTop + pos[1] - 1

width = pos[2]

height = pos[3]

border = '1px solid #ff0000'

}

area.onmouseout = function(){ outArea(area)}

document.attachEvent ? this.parentNode.appendChild(area) :

this.parentNode.replaceChild(area, this)

}

function outArea(elem){

document.attachEvent ? elem.parentNode.removeChild(elem) :

elem.parentNode.replaceChild(elem._area, elem)

}

window.onload = function(){

var map, areas, j, i = 0, imgs = document.images

for (i <imgs.lengthi++) {

map = imgs[i].useMap

if (map) if (map = document.getElementById(map.slice(1))) {

areas = map.getElementsByTagName('area')

for (j = 0j <areas.lengthj++)

areas[j].onmouseover = (function(img){

return function(){ inArea.call(this, img)}

})(imgs[i])

}

}

}

在需要去掉边框的<area>标签中加入onfocus="blur(this)"

分析：onfocus

事件在对象获得焦点时发生，那么blur(this)则是让当前对象失去焦点。而那个鼠标按下出现的蓝色边框则是焦点线了。

注：一般为了页面美观和效果一致，要去掉这种html标签自带的效果。但是，通常情况下，尽量不要刻意去除。

若是要在每一个aera上加入，仅用js做一下处理

$(function(){

$.each($("#safeMap

area"),function(i,val){

$(val).attr({"onfocus":"blur(this)"})

})

})

---