Bootstrap overriding Google Font

Несмотря на другие ответы, я не могу заставить Bootstrap не переопределять шрифт Google, который я хочу использовать. Я попытался изменить положение своих таблиц стилей, но ничего не работает.
Любая помощь с этим будет принята с благодарностью.Bootstrap overriding Google Font

http://codepen.io/01scatman/pen/KzGdNY

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
    <link rel="stylesheet" type="text/css" href="AOS-TC.css"> 
    <link href='https://fonts.googleapis.com/css?family=Arvo:400,700' rel='stylesheet' type='text/css'>

источник

2016-04-27 Craig

Где вы указываете свой шрифт «arvo» в своем CSS. Для этого используйте правило CSS '@ font-face'. – ahPo

это в теле. – Craig

У меня нет ничего, кроме следующих в документе, и она работает. Bootstrap не переписывает шрифт.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
<link rel="stylesheet" type="text/css" href="AOS-TC.css"> 
<link href='https://fonts.googleapis.com/css?family=Arvo' rel='stylesheet' type='text/css'> 

<style> 
    body{ 
    font-family: 'Arvo', serif; 
    } 
</style> 

Hello

источник

2016-04-27 21:26:40

Я пробовал оба из них и ни один не работал. Я в недоумении. – Craig

проверить это: http://stackoverflow.com/questions/21678458/google-font-not-working-with-bootstrap –

Я посмотрел на это раньше, и это не помогло. – Craig

Может быть, попробуйте добавить "важный" на вашем теле CSS

body { 
 
    margin: 0; 
 
    padding: .1px; 
 
    position: relative; 
 
    background: url(http://www.adventuresofscatman.com/wp-content/uploads/2015/09/IMG_4273.jpg); 
 
    background-repeat: no-repeat; 
 
    background-size: cover; 
 
    background-color: #555; 
 
    overflow-x: hidden; 
 
    font-family: Arvo !important; 
 
    font-weight: 700; 
 
}

источник

2016-04-28 05:03:34

или вы можете скачать CSS и разместить его на свой сервер https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css и заменить шрифт -семейно по конкретному тегу, где вы хотите применить шрифт Arvo. –

Не знаю, почему шрифт быть переопределены, но вы можете использовать fontSwitcher (на CodePen), чтобы применить Это. Я попробовал это на вашей ручке, и это касается Арво. Добавьте эту строку в голову:

<script src="http://codepen.io/freginold/pen/vLJewY.js"></script>

И эту строку в раздел JavaScript:

fontSwitcher('fontName', 'elementClass');

fontSwitcher применяется шрифт Google по классам, так что если вы хотите, чтобы применить его к всем телом, назначьте класс телу, а затем примените шрифт к этому классу.

Вы также можете указать замещающего шрифты, например:

fontSwitcher('fontName', 'elementClass'[, 'fallbackFont1', 'fallbackFont2' ...]);

Отказ от ответственности: fontSwitcher еще в стадии разработки, но он полностью функционален.

источник

2016-06-02 12:39:39 freginold

Кроме того, добавление 'font-family: Arvo;' в класс .secondary' применит Arvo к вашей подзаголовке, поэтому, возможно, вам просто нужно настроить шрифт по-другому. – freginold

Bootstrap overriding Google Font

ответ

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