如何删除图像地图的蓝色边框？ [英] How do you remove the blue border of an image map?

问题描述

目标网页是静态背景图片，我创建了带有图片映射的可点击区域。问题是，当您单击该区域时，会出现一个蓝色边框（请参见下图）。我想删除该边框，但是似乎没有任何作用。

The landing page is a static background image and I created a clickable area with image map. The problem is that a blue border (see image below) shows up when you click on the area. I want to remove that border however nothing seems to be working.

<div class="fixed-background" >
<img src="picture.svg" usemap="#image-map">
</div>

<map name="image-map">
<area href="target.org" coords="300,1000,30,1100" shape="rect">
</map>

推荐答案

这似乎是 focus 状态。

您可以避免定义

*:focus { outline: none; }

但另一方面，可见焦点对于不使用鼠标的人很重要或触摸板，即谁只使用键盘在页面上移动（关键字ACCESSIBILITY），因此您应该考虑保留原样（也许只是更改轮廓颜色以使其更适合您的页面）

but on the other hand, the visible focus is important for people who don't use a mouse or touchpad, i.e. who only use the keyboard for moving around at a page (keyword ACCESSIBILITY), so you should really consider leaving it as is (maybe only change the outline color to fit better in your page)

这篇关于如何删除图像地图的蓝色边框？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！