Benutzerdefinierte Schriftart funktioniert nicht mit Bootstrap

Ich versuche, eine benutzerdefinierte Schriftart in CSS hinzuzufügen, aber es funktioniert nicht.Benutzerdefinierte Schriftart funktioniert nicht mit Bootstrap

Mein HTML:

<!DOCTYPE html> 

<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>Shout!</title> 
    <meta name="author" content="Jordan Baron"> 

    <link rel="stylesheet" href="styles.css"> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
    </head> 
    <body> 
    <div> 
     <img src=images/logo.png alt="logo" height="54" wdth="133" class="logo"> 
     <hr class="divider"> 
     <h1 id="wis">Shout!</h1> 
    </div> 
    <script src="scripts.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"> </script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"> </script> 
    </body> 
</html>

Meine CSS:

@font-face { 
    font-family: SanFran; 
    src: url(SF-UI-Display-Thin.otf); 
} 

div { 
    text-align: center; 
} 

.divider { 
    margin: 0; 
    padding: 5px; 
} 

.logo { 
    margin: 0; 
    padding: 5px; 
} 

.wis { 
    font-family: SanFran; 
}

Ich bin mit Bootstrap 3 auf Mac OS X. Ich bin mit Chrome. Die Schriftart ändert sich, wenn ich Bootstrap nicht verwende, aber wenn ich Bootstrap benutze, ändert sich die Schriftart nicht

Quelle

2016-08-07 Anonymous

ändert, wo sich 'SF-UI-Anzeige-Thin.otf' befindet – jonju

Es wird sich nicht ändern, weil Sie eine ID auf Ihrem <h1> verwenden, aber Sie versuchen, ein Ziel zu erreichen Klasse von .wis anstelle einer ID von #wis.

Try

.wis { 
    font-family: SanFran; 
}

#wis { 
    font-family: SanFran; 
}

Quelle

2016-08-07 17:44:35 ProEvilz

Benutzerdefinierte Schriftart funktioniert nicht mit Bootstrap

Antwort

Verwandte Themen