In HTML, how to remove the border from the area in the map

HTML code

<map name= "Safemap" id= "Safemap" >
<area shape= "rect" coords= "4,191,156,233" href= "http://www.cadf.org.cn/" target= "_blank"/>
<area shape= "rect" coords= "163,191,320,233" href= "http://hk.shmzj.gov.cn/" target= "_blank"/>
<area shape= "rect" coords= "322,191,480,233" href= "http://www.yintongcard.com/ytcard/zh_CN/index.html" target= "_ Blank "/>

<area shape= "rect" coords= "4,240,156,282" href= "http://cn.unionpay.com/" target= "_blank"/>
<area shape= "rect" coords= "163,240,320,282" href= "http://www.chinaums.com/" target= "_blank"/>
<area shape= "rect" coords= "322,240,480,282" href= "http://www.chinapay.com/" target= "_blank"/>

<area shape= "rect" coords= "4,291,156,333" href= "http://www.cpic.com.cn/cpic/index.shtml" target= "_blank"/>
<area shape= "rect" coords= "164,291,321,333" href= "http://www.pingan.com/index.shtml" target= "_blank"/>
<area shape= "rect" coords= "327,291,480,333" href= "http://www.spdb.com.cn/" target= "_blank"/>
</map>

Effect:

Problem:

When you move the mouse over the area of the map, a blue border will appear when the mouse clicks down.

Scheme:

Add onfocus= "blur (this) to the <area> tag where you want to remove the border.

Analysis: The onfocus event occurs when the object receives focus, so blur (this) loses focus on the current object. The blue border that appears when the mouse is pressed is the focus line.

Note: Generally for the appearance of the page and the effect of the same, to remove the effect of this HTML tag comes with. However, usually, try not to deliberately remove.

If you want to add to each aera, only use JS to do a bit of processing

$ (function () {

$.each ($ ("#safeMap area"), function (I,val) {
$ (val). attr ({"onfocus": "Blur (This)"});

})

})

In HTML, how to remove the border from the area in the map