css 删除选择/突出显示文本上的文本阴影(mozilla)
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13027452/
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
css to remove text shadow on select / highlight text (mozilla)
提问by Danield
I'm using text shadows for most text site wide, but when you highlight / select the text - the text looks fuzzy. So in order to remove the text shadow I use this css from here.
我在大多数文本站点范围内使用文本阴影,但是当您突出显示/选择文本时 - 文本看起来很模糊。所以为了删除文本阴影,我从这里使用了这个 css 。
::-moz-selection,
::-webkit-selection,
::selection {
text-shadow: none;
background: #333;
color: #fff;
}
The problem is that for some reason moz-selection
doesn't seem to work (anymore?) in mozilla (Firefox).
问题是,出于某种原因moz-selection
,在 mozilla (Firefox) 中似乎不起作用(不再?)。
Here's the jsFiddle
这是jsFiddle
回答by Danield
It seems like the problem was due to grouping multiple css rules (for the vendor specific css) together in conjuntion with the ::selection pseudo element.
问题似乎是由于将多个 css 规则(针对供应商特定的 css)与 ::selection 伪元素组合在一起。
I originally thought that it was sufficient to write each statement on a separate line.
我最初认为将每个语句写在单独的行上就足够了。
I was mistaken.
我错了。
So if I replace this code:
因此,如果我替换此代码:
::-moz-selection,
::selection {
text-shadow: none;
background: #333;
color: #fff;
}
..With this code:
..用这个代码:
::-moz-selection
{
text-shadow: none;
background: #333;
color: #fff;
}
::selection {
text-shadow: none;
background: #333;
color: #fff;
}
.... bingo, it works.
....宾果游戏,它的工作原理。
Support is also very good (for desktop): Caniuse
支持也很好(对于桌面):Caniuse
Also, if you use LESS or SASS - you could easily write a mixin to get around the repitition.
此外,如果您使用 LESS 或 SASS - 您可以轻松编写一个 mixin 来解决重复问题。
回答by initall
The following is documented on Mozilla Developer Network:
以下记录在 Mozilla Developer Network 上:
Though this pseudo-element was in drafts of CSS Selectors Level 3, it was removed during the Candidate Recommendation phase, as it appeared that its behavior was under-specified, especially with nested elements, and interoperability wasn't achieved (based on discussion in the W3C Style mailing list).
The ::selection pseudo-element currently isn't in any CSS module on the standard track. It should not be used in production environments.
虽然这个伪元素在 CSS Selectors Level 3 的草案中,但它在候选推荐阶段被删除了,因为它的行为似乎没有指定,尤其是嵌套元素,并且没有实现互操作性(基于讨论W3C 风格的邮件列表)。
::selection 伪元素当前不在标准轨道上的任何 CSS 模块中。它不应该在生产环境中使用。