Html 在 Google Chrome 中单击图像后，如何去除图像周围的边框？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15156893/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to remove the border around image appearing after clicking on the image in Google Chrome?
提问by PHPLover
Actually I'm using a plugin SpryTabs to navigate the menu. I've used two background-images for activating and deactivating of tabs. I'm activating a tab on hover. Means the tab gets highlighted and deactivate the selected tab on clicking other tab.
实际上，我正在使用插件 SpryTabs 来导航菜单。我使用了两个背景图像来激活和停用选项卡。我在悬停时激活一个选项卡。意味着该选项卡会突出显示并在单击其他选项卡时停用所选选项卡。
Until here everything is fine. But the real problem comes when user clicks on the tab after hover, the border gets displayed around the image.
直到这里一切都很好。但真正的问题是当用户在悬停后单击选项卡时，边框会显示在图像周围。
This doesn't happen in Firefox, it happens only in Chrome and IE.
这不会发生在 Firefox 中，它只会发生在 Chrome 和 IE 中。
回答by PHPLover
You can add the following code in CSS for specific elements
您可以在 CSS 中为特定元素添加以下代码
textarea:focus, input:focus{
outline: none;
}
And for all elements on a page use this generalized code in your css
对于页面上的所有元素，请在 css 中使用此通用代码
*:focus {
outline: none;
}
This worked for me when there was an orange coloured border appearing around the images and input boxes.
当图像和输入框周围出现橙色边框时，这对我有用。
回答by Harsha Ivaturi
Try outline: none;on the images
试试看outline: none;图片
回答by Sergio
Had same issue once, following style fixed problem:
曾经有过同样的问题，以下样式修复了问题：
outline: 1px solid transparent;
Btw outline:nonehas no effect for chrome for some reason
顺便说一句outline:none，出于某种原因，对 chrome 没有影响
