CSS按钮调整

我已经建立了一个自定义<button>，这是完全使用CSS和CSS3风格。一切工作得很好，除了几个浏览器之间的视觉烦恼之外。CSS按钮调整

我在Internet Explorer和Firefox注意按我的按钮后，一个虚线边框按钮周围的文本可见，像这样：

enter image description here

这是无法与Chrome或Opera的情况下。

此外，在Internet Explorer和Opera的按钮点击时，按钮就会移动文本表明用户点击的按钮：

enter image description here

这不是在Chrome或Firefox浏览器的问题。

在CSS中删除虚线边框并在上述浏览器中移动文本的方法有哪些？

来源

2012-03-10 Oliver Spryn

你可以在按钮上显示当前CSS吗？我觉得这样的事情会解决这个问题为您在Internet Explorer不能确定的FireFox ...

a.button:active, a.button:selected, a.button:visited { 
    border: none; 
    outline: none; 
}

来源

2012-03-10 22:17:22

是那个固定的'outline'属性修复了IE中的虚线边框问题，但不包括Firefox。我实际上使用了我的按钮的边框，所以我没有应用第一个建议。谢谢瑞恩！ – 2012-03-10 22:21:29

在Firefox中，点击某物后，如果您没有转到新页面或其他东西，您的焦点仍然位于该按钮上。然而，你想要：聚焦风格。您可以改为具有以下特征的整体样式：不包括轮廓的焦点。这样，键盘手就可以获得爱情，而焦点风格将保留在FF（以及其他一些浏览器）中，但这不会成为富有幻想的轮廓。 – stommepoes 2012-03-10 23:08:20

来源

2012-03-10 22:20:11 Locke

是的，这适用于IE浏览器！ – 2012-03-10 22:22:57

CSS按钮调整

回答

相关问题