сss (9) сss3 (14) ajax (2) css (42) drupal (7) Fix IE6 (4) font (4) html (23) javascript (22) jQuery (15) js (5) less (1) php (1) scss (1) soft (2) vue (1) webstorm (1) wordpress (1)

Сглаживание шрифтов в web


так подключаються шрифты:

@font-face {
    font-family: 'fontRegular';
    src: url('../fonts/font-webfont.eot');
    src: url('../fonts/font-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/font-webfont.woff') format('woff'),
         url('../fonts/font-webfont.ttf') format('truetype'),
         url('../fonts/font-webfont.svg#fontRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

теперь магия :) весь фокус в том что (во всяком случаи хром) видет и truetype шрифтовый и svg красивый :), так вот что бы было красиво надо svg подключать поверх трутайпа... тоесть так:

@font-face {
    font-family: 'fontRegular';
    src: url('../fonts/font-webfont.eot');
    src: url('../fonts/font-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/font-webfont.svg#fontRegular') format('svg'),
         url('../fonts/font-webfont.woff') format('woff'),
         url('../fonts/font-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

ещё есть варианты, поиграться с цсс типа: text-shadow, -webkit-font-smoothing, text-rendering...