меняющейся глобальной шрифт

Хорошо, так что я есть шрифт, который я использую для абсолютно все на моей странице (кроме логотипа)меняющейся глобальной шрифт

* { 
    margin: 0; 
    padding: 0; 
    font-family: 'Titillium Web', sans-serif; 
}

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

<h1 style='font-family: "Aref Ruqaa", serif;'>Logo Text</h1>

TLDR: Как заставить его применять другой шрифт на этом H1? Я попробовал использовать начальный шрифт-семейство, а затем установил другой шрифт, но ничего не получилось.

Пример: http://codepen.io/anon/pen/BQOaXo

источник

2016-12-11 Tomislav Nikolic

вы можете поделиться jsbin или codepen с этим примером –

Здесь вы идете http://codepen.io/anon/pen/BQOaXo –

Рядный стиль переопределяет глобальные свойства, хотя: https://jsfiddle.net/AndrewL32/e0d8my79/171/ –

Добавить классы в HTML элементов и убедитесь, что эти классы нагрузки после вас глобальный шрифт.

Избегайте встроенного укладки.

@font-face { 
 
    font-family: 'Yrsa'; 
 
    font-style: normal; 
 
    font-weight: 400; 
 
    src: local('Yrsa'), local('Yrsa-Regular'), url(https://fonts.gstatic.com/s/yrsa/v1/HvXbkSMs7hgg2r-HiCNOmA.woff2) format('woff2'); 
 
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; 
 
} 
 
@font-face { 
 
    font-family: 'Indie Flower'; 
 
    font-style: normal; 
 
    font-weight: 400; 
 
    src: local('Indie Flower'), local('IndieFlower'), url(https://fonts.gstatic.com/s/indieflower/v8/10JVD_humAd5zP2yrFqw6ugdm0LZdjqr5-oayXSOefg.woff2) format('woff2'); 
 
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; 
 
} 
 
body { 
 
    background: #111; 
 
    color: #999; 
 
    text-align: justify; 
 
    text-justify: inter-word; 
 
    max-width: 80%; 
 
    margin: 10% 
 
} 
 
* { 
 
    font-family: 'Yrsa'; 
 
} 
 
.other { 
 
    font-family: 'Indie Flower'; 
 
}

<body> 
 
    <div> 
 
    <h1>This is a Header 1 in font A</h1> 
 
    <h1 class="other">This is a Header 1 in font B</h1> 
 
    <h2>This is a Header 2 in font A</h2> 
 
    <h2 class="other">This is a Header 2 in font B</h2> 
 
    <h3>This is a Header 2 in font A</h3> 
 
    <h3 class="other">This is a Header 2 in font B</h3> 
 
    <p>This is a paragraph using font A 
 
     <br>Lorem ipsum dolor sit amet, in eam simul nostrud definiebas, mea iusto placerat prodesset ei. Eum summo audiam ea. Vitae aperiri at duo. Vis atomorum partiendo id, nam ea noluisse platonem. Nec minimum consequat cu, pri in harum moderatius. Ferri 
 
     aperiam forensibus an nam.</p> 
 
    <p class="other">This is a paragraph using font B 
 
     <br>Lorem ipsum dolor sit amet, in eam simul nostrud definiebas, mea iusto placerat prodesset ei. Eum summo audiam ea. Vitae aperiri at duo. Vis atomorum partiendo id, nam ea noluisse platonem. Nec minimum consequat cu, pri in harum moderatius. Ferri 
 
     aperiam forensibus an nam.</p> 
 
    </div> 
 
</body>

источник

2016-12-11 17:18:10

Yeeep Это тот, который я ищу. Спасибо –

Рад, что работает. Пожалуйста –

Просто используйте это в CSS:

h1{ 
    font-family: 'Aref Ruqaa', sans-serif; 
}

http://codepen.io/anon/pen/mOGybb

источник

2016-12-11 17:18:11 Johannes

Я думаю, что вы изменить глобальный шрифт, можно использовать этот синтаксис в CSS файле:

h1 {font-family: Aref Ruqaa, sans-serif; }

источник

2016-12-11 17:21:42

меняющейся глобальной шрифт

ответ

Смежные вопросы