Икона смелее в белом

Question

Я работаю над веб-проектом.Я хотел бы отобразить fonticon внутри некоторых кнопок и установить цвет на белый.Однако кажется, что изменение цвета переднего плана меняет вес иконки.На этом изображении обе эти кнопки имеют одинаковые классы и свойства, отличается только атрибут цвета.

Я попытался наложить эти две ирезультат показывает, что на самом деле эти две ширины немного отличаются, что вызывает огромную разницу, когда они отображаются в их реальном размере.

После этоссылка Я пытался поиграть с такими:

-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-o-font-smoothing: antialiased;

, но безуспешно.

Есть ли у вас какие-либо подсказки относительно какого-либо свойства css, которое может влиять на толщину этих значков?

Это связано с самим шрифтом?

РЕДАКТИРОВАТЬ:

Снимок экрана в реальном размере

Answer 1

Значки не смелее белого цвета.

Скорее всего, именно ваш глаз воспринимает их таким образом, потому что белый обеспечивает больший контраст с током background-color, чем черный.

Но с технической точки зрения глифы шрифтов имеют одинаковые размеры независимо от цвета. Фактически, учитывая современную технологию шрифтов, невозможно обеспечить различные формы на основе текущего font-color.

Однако, несмотря на то, что на уровне страницы глифы шрифтов всегда имеют одинаковый размер, возможно, что либо используемый браузер, либо операционная система изменяют отображаемый вывод на основе алгоритмов, направленных на повышение читабельности текста .

Простое отключение этих опций (на уровне браузера или операционной системы, в зависимости от того, где они определены) должно решить проблему (где под «проблема» мы подразумеваем: «визуализированная форма имеет разные размеры в снимках, взятых с той же страницы ").