2017-10-18 5 views
0

CLARIFICATION DOUBLE - Cette question concerne les différences entre les navigateurs dans les poids des polices, la question mise en évidence en tant que doublon possible concerne le téléchargement correct des fichiers de police. Je télécharge un site sur Wordpress en utilisant un thème enfant de html5blank et j'obtiens des variations de fonte de polices sur différents navigateurs que je ne reçois pas avec les fichiers texte frontaux autonomes. Ce que je veux dire sur le texte pour un effet de vol stationnaire -Wordpress - le poids des polices varie selon les navigateurs

Chrome/Safari

Chrome/Safari version

Firefox (ce que je veux)

firefox

J'ai essayé d'utiliser le code de la réponse de cette pile question

body { 
    -webkit-font-smoothing: subpixel-antialiased; 
} 

Mais cela n'a pas fonctionné. Si j'utilise font-weight: bold; alors cela fonctionne pour Chrome mais jette Firefox et Safari. Ceci est la police que j'utilise -

@font-face { 
    font-family: 'Gotham-Light'; 
    src: url('fonts/Gotham-Light.otf') format('opentype'); 
    font-weight: normal; 
    font-style: normal; 

} 

body { 
     font-family: 'Gotham-Light', sans-serif; 
     font-size: 16px; 
     -webkit-font-smoothing: subpixel-antialiased; 

    } 

Est-il possible de résoudre ce problème? Le client est un professionnel de la conception et était très spécifique sur des choses comme ça. Toute aide appréciée.

+0

Tout ce que vous avez, c'est la police OTF. – scoopzilla

+0

@scoopzilla C'est tout ce que j'ai. Ai-je besoin de plus? Si oui, lesquels? –

+0

Copie possible de [CSS Import Fonts] (https://stackoverflow.com/questions/32563123/css-import-fonts) – jmargolisvt

Répondre

1

D'abord, vous devriez avoir tous les types de polices associés à cette police de caractères pour la compatibilité cross-browser:

CSS3 Web Fonts

Vous pouvez réellement les rendre ici:

Font Squirrel Webfont Generator

Et Parfois, vous ne pouvez pas contrôler comment les navigateurs vont gérer différentes polices. Safari agira totalement différent de Firefox, etc.

Enfin: Il est utile d'utiliser la police actuelle WEIGHTS au lieu des valeurs par défaut "bold" et "light".

Exemple:

body { 
    font-family: 'Gotham-Light', sans-serif; 
    font-weight: 300; 
    font-size: 16px; 
    -webkit-font-smoothing: subpixel-antialiased; 

} 

J'espère que cela aide.

+0

Salut, J'ai téléchargé tous les autres types de polices et je reçois encore différentiel de poids de police - est-ce que je peux faire quelque chose ou est-ce juste? –