Question

有人知道如何删除Opera中按钮上的虚线轮廓吗？

Answer 1

的介绍

对于许多网页设计师而言，可访问性让人联想到具有屏幕阅读器的盲人用户的图像，以及使这些特定受众可以访问网站的困难。当然，可访问性涵盖了超出屏幕阅读器用户极端范例的各种情况。虽然使复杂的网站可访问确实是一个令人生畏的前景，但也有许多小事情不仅仅是一些明智的规划，而且非常容易测试（无需购买昂贵的辅助技术）），并且可以对某些用户组产生重大影响。

在这篇简短的文章中，我们将重点关注键盘可访问性以及CSS的粗心使用可能会使您的网站完全无法使用。

以及outline management上的文章给出的测试列表。

更新2011-02-08

我可以确认现在不可能。它有一个开放的bug。

Answer 2

我做到了。

在这里：http://jsbin.com/oniva4。 [在Opera 10.5 / 11上测试]

秘诀是使用outline-offset:-2px;（有效地覆盖点）和轮廓的背景颜色。从版本9.5开始支持outline-offset。

Answer 3

我这说明了一个明确的条件，即你不应该删除大纲，除非你用其他表示焦点状态的东西替换它......

如果对元素应用变换，它会在opera中杀死大纲;它甚至不需要进行可见变换，仅仅应用属性就足够了。所以这将完成这项工作：

#myButton:focus
{
    -o-transform:rotate(0);
}

但我不能保证不会被视为渲染错误，因此将来可能会发生变化。

Answer 4

我认为问题在于您指定大纲属性的位置。试试这个：

*:focus, *:active {
        outline: none; (or possibly outline: 0)
}

我对此进行了更多的研究，看起来在输入字段和按钮上，除非你编辑浏览器的配置，否则它将无法工作，就像Firefox的about：config页面一样。这似乎是出于可访问性原因而做的，因此可以使用键盘在不使用鼠标的情况下填写和发送表单。

Answer 5

我在上面的文字区域使用了这个技巧并且工作正常！使用id为“itens”的文本区域，就在这里！

#itens:focus, #itens:active{
    outline: 1px solid white;
    outline-offset: -2px;
}

所以，你可以玩那个：

#itens:focus, #itens:active{
    outline: 1px solid lime;
    outline-offset: -2px;
}

Answer 6

您在寻找：

button{
  outline:none;
}

或者您的按钮是输入...

input[type=button]{
  outline:none;
}

Answer 7

刚刚在歌剧网站上阅读此论坛帖子

http://my-beta.opera.com/community/forums/topic.dml?id=712402

似乎没有解决方法

Answer 8

除了上面的提示之外 - 根据经验，我发现它并不总是有效，并且总是不合适，因为它可以改变元素以微妙的，有时令人不愉快的方式呈现的方式。 / p>

所以，如果这不起作用，你可以做的另一件事就是将轮廓颜色指定为“rgba（0,0,0,0）”

Answer 9

如果你在样式表中附加css-reset应该可以解决问题。

Answer 10

删除锚标记的大纲

a {outline : none;}

从图片链接中删除大纲

a img {outline : none;}

从图片链接中删除边框

img {border : 0;}

Answer 11

这不是一个答案，而是更多关于似乎正在发生的事情的解释：

故事

我删除歌剧大纲的原因是添加了我自己的轮廓。添加我使用的大纲：

:focus{
    outline:1px dotted #999;
    outline-offset:-3px;
}

除了Opera之外，其他所有浏览器都能正常运行。相反，Opera会为您提供这种奇怪的干涉模式，看起来像dotted-dashed轮廓：
both
现在，如果你删除你的轮廓，你仍然有Opera提供的标准轮廓，一个简单的1px间隔虚线： opera
由于除了Opera之外我无法为每个浏览器添加样式，所以我决定在添加自己的之前删除Opera的大纲。使用brothercake的解决方案，-o-transform:rotate(0);执行此操作然后应用我自己的大纲：
css
瞧！