Problème de police-poids Safari, texte trop gras
Lorsque j'applique un font-weight:bold
style, le look de la police est trop gras dans Safari lorsque comparé à d'autres navigateurs. J'ai essayé ci-dessous css comme l'ont proposé certains site, mais c'est toujours la même.
text-shadow: #000000 0 0 0px;
Des captures d'écran de rendu de texte:
Chrome
Safari
Voici mon css déclaration:
p {
margin: 8px 5px 0 15px;
color:#D8D2CE;
font-size:11pt;
letter-spacing:-1px;
font-weight: bold;
font-family: LektonRegular;
}
@font-face {
font-family: 'LektonRegular';
src: url('myfonts/lekton-regular-webfont.eot');
src: url('myfonts/lekton-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('myfonts/lekton-regular-webfont.woff') format('woff'),
url(myfonts/lekton-regular-webfont.ttf) format('truetype'),
url('myfonts/lekton-regular-webfont.svg#LektonRegular') format('svg');
font-weight: normal;
font-style: normal;
}
Comment cela peut-il être fixé?
source d'informationauteur user1184100
Vous devez vous connecter pour publier un commentaire.
Pour le rendu du texte en gras systématiquement sur tous les navigateurs, votre police doit explicitement contenir les caractères en gras. Sinon, les navigateurs probablement essayer de faire gras variantes de caractères en fonction de leur variantes de la normale, et les résultats sont contradictoires entre les différents navigateurs puisqu'ils ont sûrement des algorithmes différents pour une telle conversion.
Également noter que le texte de rendu peut être différent sur différentes plates-formes au niveau du système (par exemple, Windows, Mac OS). De telles différences sont OK et ne font généralement pas besoin d'être fixé.
Voir aussi la rubrique sur l'-webkit-font-smoothing propriété.
Utilisation
-webkit-font-smoothing: antialiased;
Le text-shadow astuce ne fonctionne plus.
L'-webkit solutions ne fonctionnent pas pour le enjeu important pour de nombreux google polices, les polices personnalisées et des polices qui n'ont pas de valeurs prédéfinies.
Le problème est que vous devez spécifier la valeur de gras dans le fort des balises.
Cela peut être fait de deux manières:
Vous pouvez inclure à partir de Google Polices ou de l'endroit où votre police est dans ta tête; il a besoin à la fois de l'ordinaire de la police et de la police en gras chacun doit avoir une police différente-poids numéro de 400 régulière et 600 gras par exemple:
Ou utiliser les précédents source code et le coller dans votre propre feuille de style css comme ci-dessous:
Utilisez ce que votre police est à la place de XXX.
Puis aussi en forte
{font-weight:600;}
Aucune des réponses ici a fonctionné pour moi. Peut-être parce que j'utilise la version windows de Safari pour les tests. J'ai dû inclure la police en gras dans mon CSS pour résoudre le problème. Dans le cas de la question d'origine, il serait nécessaire d'ajouter le suivant (avis il utilise la même police-nom de famille)
Cela a fonctionné dans tous les navigateurs pour moi.
J'ai trouvé une solution pour ce problème particulier. En fait aucune des solutions ci-dessus à force de travail pour moi. Ainsi a commencé la vérification de la valeur par défaut webkit styles ajouté par safari et a constaté que -webkit-text-stroke-width a été appliquée à des corps ayant une valeur 0,5 px. Je l'ai mis à 0!important et le problème est réglé pour moi.