Шрифт на мобильном сайте

Question

Шрифт на мобильном сайте

0

Я пытаюсь добавить шрифт на мобильный сайт с CSS следующим образом:

Файл CSS:

@font-face { font-family: Aapex; font-weight: bold; src: url('../fonts/Aapex.ttf');}
#header_txt{
        font-family: Aapex;
        font-size: 48px;
        color: #fff;
}

Он отлично работает в компьютерном браузере, но не на мобильном устройстве. Любая идея исправить это?

Mazeltov 18 фев. 2014, в 11:44

Источник

0

Что такое "мобильный"? Каждая платформа и браузер? Blackberry, iOS, Android's Chrome, Dolphin, Firefox?
Diego Agulló 18 фев. 2014, в 10:08
0

Какая мобильная ОС и какой браузер?
Donnie Rock 18 фев. 2014, в 10:08
0

Я попробовал на Android с Chrome и IOs с сафари
Mazeltov 18 фев. 2014, в 10:10
0

.ttf поддерживается не всеми браузерами. Это зависит от браузера, поддерживает ли он формат TTF или нет.
SuRaj Creator 18 фев. 2014, в 10:10
0

Какие версии? TTF поддерживается начиная с Safari 4.2 и начиная с Chrome 32.
Donnie Rock 18 фев. 2014, в 10:12
0

как узнать версию на мобильных телефонах?
Mazeltov 18 фев. 2014, в 10:12

Показать ещё 4 комментария

Теги:

html

css

mobile

3 ответа

1

использовать генератор @font-face, выполнив поиск в google

Hashir Azad 18 фев. 2014, в 09:02

1

Используйте этот код для кросс-браузера!

@font-face {
        font-family: 'YourFontName';
        src: url('YourFontName.eot'); /* IE9 Compat Modes */
        src: url('YourFontName.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
             url('YourFontName.woff') format('woff'), /* Modern Browsers */
             url('YourFontName.ttf')  format('truetype'), /* Safari, Android, iOS */
             url('YourFontName.svg#svgFontName') format('svg'); /* Legacy iOS */
        }

И конвертируйте свой формат ttf в eot, woff и svg..получите на сайт http://www.fontsquirrel.com/tools/webfont-generator и конвертируйте в этот формат

Krish 18 фев. 2014, в 08:59

Ещё вопросы

Что такое "мобильный"? Каждая платформа и браузер? Blackberry, iOS, Android's Chrome, Dolphin, Firefox?
Какая мобильная ОС и какой браузер?
Я попробовал на Android с Chrome и IOs с сафари
.ttf поддерживается не всеми браузерами. Это зависит от браузера, поддерживает ли он формат TTF или нет.
Какие версии? TTF поддерживается начиная с Safari 4.2 и начиная с Chrome 32.
как узнать версию на мобильных телефонах?

roryok · Accepted Answer · 2014-02-18T07-48-00.000Z

Как вы можете видеть здесь, все текущие версии всех основных мобильных браузеров поддерживают шрифты.ttf, однако некоторые немного более старые мобильные устройства этого не делают. Для этого вам, вероятно, потребуется добавить встроенные шрифты opentype (.eot), форматы Open Open Open (.woff) и масштабируемые векторные графики (.svg) для поддержки всего.

Ваше объявление шрифта будет выглядеть примерно так:

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