2016-06-15 11 views
3

Ich habe gerade mit Google Fonts gespielt und die Fira Sans Schriftart gefunden. Es ist nett, aber ich mag den Bold (700) Stil nicht, es ist zu fett für meinen Geschmack. Wenn ich jedoch den Stil "Mittel" (500) wähle, verwendet der Browser ihn für nichts, das auf font-weight: bold eingestellt ist (z. B. <strong>). Stattdessen verwendet es eine Art Faux Fett, die verschwommen aussieht.Ist es möglich, font-weight: bold gleich 500 statt 700 zu machen?

Ich kann mein Stylesheet durchgehen und jedes Auftreten von bold auf 500 setzen. Ich könnte Sass auch verwenden, um eine Variable wie $bold-weight: 500; zu setzen, die hilft, wenn ich beschließe, die Schriftart später zu ändern.

dass, obwohl ein bisschen nervig ist, und bold ist auch der Standard für viele Browser Stile (z <strong>, <th>), so muss ich sicherstellen, dass ich jede mögliche Auftreten, dass zu fangen. Und möglicherweise gibt es externe Skripte/Stile, die ich nicht kontrolliere.

Gibt es eine Möglichkeit, alle Vorkommen von bold Gewicht 500 zu verwenden?

+0

Wenn ich MDN richtig verstanden habe, ist "fett" im Grunde ein Alias ​​für 700. In diesem Sinne fragen Sie effektiv, ob Sie 700 gleiche 500 machen können, was nicht wahrscheinlich ist. Ich kann verstehen, warum Sie fragen, aber ich denke, Sie sind besser dran mit einer Sass-Variable, da es Ihre Absicht klar macht – Enrico

+0

Als letztes Mittel, könnten Sie die Schriftart ändern? – Enrico

+0

@Frits Warum haben Sie Ihre Antwort gelöscht? Es war nicht perfekt, aber es war keine schlechte Antwort. – DisgruntledGoat

Antwort

2

Ja, es ist,

Wenn Sie zum schnellen Einsatz einer Google-Schriftart auswählen, werden Sie mit einem Link versehen, in den Header enthalten, öffnen Sie den Link in Ihren Web-Browser und Sie würden mit einer CSS-Datei bedient werden mit vielen

/* cyrillic-ext */ 

@font-face { 
    font-family: 'Roboto'; 
    font-style: italic; 
    font-weight: 400; 
    src: local('Roboto Italic'), local('Roboto-Italic'), url(https://fonts.gstatic.com/s/roboto/v15/WxrXJa0C3KdtC7lMafG4dRTbgVql8nDJpwnrE27mub0.woff2) format('woff2'); 
    unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F; 
} 

Wie Sie die font-style: italic sehen und die font-weight: 400 mit einigen spezifischen Schriftart (Roboto Italic hier) innerhalb des @font-face Tag verbunden, was bedeutet, wenn Sie font-weight: italic mit font-weight: 400 (oder normal), bezieht er sich auf die Schrift, die in der sr c Attribut.

Nun, wenn Sie alle font-weight: bold in Ihrem CSS diese Schriftart machen wollen, ändern Sie einfach den 400 in über font-style zu bold und Sie sind fertig.

Oder Sie können ein Duplikat des vollständigen @ font-face {..} erstellen und einen anderen Schriftstil verwenden.

Sie können auch verschiedene Schriftarten hier auch verwenden. Stellen Sie sicher, dass nur ein font-style- oder font-weight-Tag in einem @ font-face enthalten ist.

In diesem Beispiel werden Google-Schriftarten verwendet. Sie können dieselbe Technik für selbst gehostete Schriftarten verwenden.