似乎通常人们想要摆脱浏览器焦点轮廓，这就是为什么我找不到这个问题的答案。
我正在尝试显示轮廓并在单击 anchor 标记后更改它们的颜色。以下代码在 Chrome 和 Firefox 上按预期工作但在 Safari 上不工作(例如，在 Safari 8.0 (10600.1.25.1) 上，我只看到单击时颜色发生变化，但之后又恢复到原始颜色) .
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
a:focus {
color:red;
outline-style: dotted;
outline-color: red;
outline-width: 2px;
}
</style>
</head>
<body>
<a href='#'>Click Me</a>
<a href='#'>Click Me Also</a>
</body>
</html>
可以试试here (jsfiddle)。
最佳答案
尝试使用 -webkit- 作为前缀
Demo
例如:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
a:focus {
color:red;
-webkit-border: 2px dotted red;
border: 2px dotted red;
}
</style>
</head>
<body>
<a href='#'>Click Me</a>
<a href='#'>Click Me Also</a>
</body>
</html>
关于html - 如何显示 :focus color and outline in Safari?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28167688/