在Firefox中输入选择外观焦点[重复]

Posted 2023-03-06

【中文标题】在Firefox中输入选择外观焦点[重复]

【英文标题】：Input select look and feel on foucs in firefox [duplicate]

【发布时间】：2015-07-30 08:30:36

【问题描述】：

我看到了一条额外的虚线，用于在 Firefox 中聚焦输入选择而不是其他浏览器，只是想知道是否有任何快速解决方法？附上下面的截图，通常在浏览器中舔其他地方后它会消失。

【问题讨论】：

为select:focus 或option:focus 尝试CSS。

使用键盘浏览您的网站的人需要一些指示选择下拉菜单获得焦点，因此如果您确实知道如何删除它，您仍然应该在获得焦点时添加一些视觉指示。

@mplungjan - 似乎不适用于选择标签。

可能是outline 属性。

@Barmar，这将选择整个选择框。当我在 Firefox 中制作一个时，选择周围没有任何内容。 fiddle

【参考方案1】：

你可以试试这个（hack）（基于这个答案：https://***.com/a/11603104/1236396）

select 
  color: #000;
  color: rgba(0,0,0,0);
  text-shadow: 0 0 0 #000;

或者这个（基于这个答案：https://***.com/a/18853002/1236396）

select:-moz-focusring 
    color: transparent;
    text-shadow: 0 0 0 #000;

【讨论】：

那也不行。

这行得通吗：select::-moz-focus-inner border: 0; ?

不，那没用。

我更新了答案。