Css 图标在白色中更为粗体

Css 图标在白色中更为粗体,css,web,font-face,antialiasing,Css,Web,Font Face,Antialiasing,我在做一个网络项目。我想在一些按钮中显示一个,并将颜色设置为白色。然而,改变前景颜色似乎会改变图标的权重。在此图像上,两个按钮的类和属性相同,只是颜色属性不同 我试着覆盖这两个,结果表明,这两个宽度确实略有不同,当它们以真实尺寸显示时,这会导致巨大的差异 接下来,我试着玩这些游戏: -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; 没有

我在做一个网络项目。我想在一些按钮中显示一个,并将颜色设置为白色。然而,改变前景颜色似乎会改变图标的权重。在此图像上,两个按钮的类和属性相同,只是颜色属性不同

我试着覆盖这两个,结果表明,这两个宽度确实略有不同,当它们以真实尺寸显示时,这会导致巨大的差异

接下来,我试着玩这些游戏:

-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-o-font-smoothing: antialiased;
没有任何成功

你有任何线索,任何css属性,可能会干扰这些图标的厚度

这与字体本身有关吗

编辑:

真实尺寸的屏幕截图

图标的白色较粗体

最有可能的是,是你的眼睛以这种方式感知它们,因为白色比黑色与当前背景色的对比度更大

但是,从技术角度来看,字体图示符的尺寸与颜色无关。事实上,考虑到当前的字体技术,不可能基于当前的
字体颜色提供不同的形状

但是,即使在页面级别,字体图示符始终具有相同的大小,也可能是所使用的浏览器或操作系统正在基于旨在提高文本可读性的算法修改呈现的输出


只需关闭这些选项(在浏览器或操作系统级别,取决于它们的定义位置)就可以解决问题(这里的“问题”是指:“从同一页拍摄的快照中呈现的形状具有不同的维度”)。

我想也是这样说的。。但是我把整个图像拿给illustrator,测量后发现它确实比黑色的厚,甚至图标的大小也不同。如果你说的是真的,用于渲染的工具(浏览器)或快照工具都有缺陷。你所声称的(基于颜色有不同形状的字体)在目前的字体技术中在技术上是不可能的。很可能是浏览器或系统正在修改输出以增加可读性。不管怎样,它不是在页面级别,而是在页面之上。我同意你的看法。。安德烈渴望你的回答。我使用术语“加粗”作为一种说法,我知道图标没有“加粗”,但这只是一个渲染问题。遗憾的是,由于这种行为,我的图标在白色中模糊/闪烁,而不是在黑色中,我无能为力。似乎没有任何配置或设置可用于绕过此行为。我有点一无所获。@Florent,如果你在Windows机器上,你可能想看看“显示设置>缩放和布局>高级缩放设置>让Windows尝试修复应用程序,使其不模糊”。关掉它。你能分享矢量图标吗?