Стиль сглаживания в стиле Photoshop в CSS - PullRequest
Новая
       38

Стиль сглаживания в стиле Photoshop в CSS

1 голос
/ 15 апреля 2011

Я в процессе настройки таблицы стилей для имеющегося у нас макета PSD нового веб-сайта. Большая часть текста в макете использует «острый» метод сглаживания из фотошопа.

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

Кстати, шрифт Arial, поэтому здесь нет ничего смешного @ font-face

Ответы [ 4 ]

2 голосов
/ 15 апреля 2011

Простая альтернатива - это text-shadow , которая является свойством css3: 

#foo {
    /* text-shadow: [color] [horizontal offset] [vertical offset] [blur] */
    text-shadow: #fff 0 1px 0;
}

Поиграйтесь с настройками;Вы можете сделать шрифт очень острого и острого вида, экспериментируя с разными цветами и значениями размытия.

1 голос
/ 15 апреля 2011

Может быть полезно font-smooth CSS3 свойство: 

font-smooth: auto | never | always | <absolute-size> | length | initial | inherit
0 голосов
/ 15 апреля 2011

Вы можете использовать библиотеку на основе сценариев ( cufón ) для настройки сглаживания и других эффектов рендеринга текста.Обратите внимание, что большинство (если не все) такие решения подходят только для заголовков и прочего, а не для всего основного текста.

0 голосов
/ 15 апреля 2011

Поскольку ваш веб-сайт будет отображаться в нескольких браузерах в нескольких ОС, невозможно добиться единообразного отображения шрифта. Я думаю, что это связано с ОС в отношении сглаживания шрифтов.

Если вам требуется, визуализируйте части в виде изображения или используйте Cufon или sIFR.

То, что я также делал в прошлом, если шрифт немного грубый, добавьте тонкий CSS3 text-shadow, который делает его более гладким.

...