28172 sujets

CSS et mise en forme, CSS3

Font-weight et Trois poids de police normal/medium/bold

Bonjour,

on m'a donné une police avec trois déclinaisons (sans parler de l'italique) de "poids" de police, pas seulement normal et bold, mais en fait normal/bold + medium.

Attention, petit avertissement : avec medium ce n'est pas la taille de la police qui change mais bien si c'est plus ou moins gras.

Dans la création graphique, ce qui a été utilisé c'est "normal" et "medium", pour ce qui est "gras" de "non gras" mais en CSS, je n'arrive pas à activer la police "medium", quand je mets font-weight:normal; c'est la police "normal" qui s'affiche quand je mets font-weight:bold; c'est la police "bold" qui s'affiche et font-weight:medium; n'est pas reconnu apparemment car ca me met le poids hérité (bold dans mon cas).

Et quand je joue sur la valeur numérique de font-weight par exemple font-weight:250 ou font-weight:350, je passe du "normal" au "bold", sans passer par ma police de poids "medium".

En fait, il faudrait que dans les trois cas possibles de weight :

font-weight:normal;
font-weight:bold;
font-weight:bolder;

Ca soit respectivement les polices normal/medium/bold qui soient affichés.

Avez-vous déjà rencontré ce genre de problème ?

Savez-vous comment le mapping "font-weight" / "choix de la variante de police installée sur le système" à afficher est géré en CSS ?

Merci beaucoup d'avance de vos réponses.
Modifié par jreeman (28 Apr 2011 - 13:13)
bonjour,

je ne crois pas qu'un seul navigateur aujourd'hui fassent la difference entre les 'graisses' possible.
En gros tu n'as que normal et bold de dispo.

Pour passer entre ou modifier l'aspect de ta fonte, tu peut tenter de jouer avec text-shadow et rgba():
<p class="light">Light</p>
<p class="normal">Normal</p>
<p class="medium">Medium</p>
<p class="bold">Bold</p>

et css
p {background:white;color:#333;font-family:georgia;}
.light {Color:rgba(255,255,255,0.7);text-shadow:1px 0 0  #000;font-weight:normal;}
.normal {font-weight:normal;}
.medium {text-shadow:0 0 0px #000,0 0 0;font-weight:normal;}
.bold{font-weight:bold;}


++
gc-nomade a écrit :
bonjour,

je ne crois pas qu'un seul navigateur aujourd'hui fassent la difference entre les 'graisses' possible.

Oui; c'est bien cette "rigidité" mon problème.

a écrit :
En gros tu n'as que normal et bold de dispo.


+ bolder (mais moi j'ai besoin d'avoir accès à quelque chose qui est en fait entre normal et bold).
bonsoir,

bold et bolder ou le même effet sur normal.
"plus bold que bold" n'as aucun effet ou je ne perçoit pas la différence. Je peut me tromper Smiley smile .

A part te proposer de jouer sur les text-shadow pour un rendu intermédiaire approximatif via css.

Il y a probablement d'autre solutions : images, font-face avec une police retravaillée .. ?
Si, si, bolder a un effet, mais seulement à condition que sur ton système, les deux polices de type bold et bolder aient été installées.

Ce qu'il faut comprendre, et que tu ne sembles pas avoir compris malgré mes explications, c'est que l'interprétation de la transformation visuelle du texte en prenant en compte ce qui est indiqué dans "font-weight" n'est pas la responsabilité de ton navigateur.

Le role du navigateur dans cette opération est limitée puisque le navigateur se contente seulement d'aller récupérer sur ton système la définition de ta police déclinée suivant ce que tu as spécifié dans ta CSS. Ce qui fait que si tu spécifies pour une police untelle bolder mais que sur ton système la police untelle en question déclinée en bolder n'est pas présente, tu ne verras pas de différence entre bolder et bold, car dans ce cas, ton navigateur se contente de prendre la police la plus proche à savoir, c'est à dire bold.
Par contre, si tu prends une police pour laquelle bold et bolder sont bien présentes sur ton système alors là tu noteras bien la différence.
Modifié par jreeman (11 May 2011 - 14:25)
Sujet clos
Aller à