悬停时未突出显示链接中的 Unicode 字符答案

【问题标题】：Unicode character in link is not highlighted on hover悬停时未突出显示链接中的 Unicode 字符
【发布时间】：2017-10-31 18:02:31
【问题描述】：

为什么（背后的意图）unicode字符在其他文本突出显示时没有突出显示？

a:hover
{
  color: #ffd800;
}

&lt;a href="#"&gt;Some text that is hightlighted but why this symbol ???? doesn't highlight!??&lt;/a&gt;

【问题讨论】：

Color for Unicode Emoji的可能重复
@IiroP ty 获取链接。但是为什么这些 unicode 符号与普通符号（ascii 字母、数字、标点符号等）的处理方式不同，有什么理智的原因吗？
我不明白这里的问题。当我将鼠标悬停在符号上时，它会改变颜色。
@KiranDash 你用的是什么浏览器？我在 chrome (Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36) 上进行了测试。可能是 chrome 唯一的问题...在 IE (Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; rv:11.0) 像 Gecko) 上突出显示虽然有效。
好吧，我也使用 chrome。 :)

标签： html css unicode hyperlink hover

【解决方案1】：

该符号称为表情符号（扩展的 unicode）。它现在在 Chrome、Opera、Safari 上显示时是彩色的……所以你不能改变它的颜色。如果您仔细查看该符号，您会发现它的颜色是灰色的，带有黑色边框（在 Windows 上，在 MacOS 上有所不同，...）。如果你在 IE/Edge 上查看，可能会看到变化（因为 IE/Edge 目前不支持彩色表情符号）。

【讨论】：

感谢您的澄清。可以使用 css:.un:hover /*for unicode highlight*/ { color:transparent; text-shadow: 0 0 0 #ffd800; } 和 html <a href="#" class="un">Some text that is hightlighted completely ?.</a> 更改视觉外观特征。
您可以为它们添加效果，例如：过滤器。它会改变，但不会改变颜色。颜色属性不会改变！