From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/fr/web/css/@font-face/font-style/index.html | 101 ++++++++++++++++++++++ 1 file changed, 101 insertions(+) create mode 100644 files/fr/web/css/@font-face/font-style/index.html (limited to 'files/fr/web/css/@font-face/font-style') diff --git a/files/fr/web/css/@font-face/font-style/index.html b/files/fr/web/css/@font-face/font-style/index.html new file mode 100644 index 0000000000..b3265e2d68 --- /dev/null +++ b/files/fr/web/css/@font-face/font-style/index.html @@ -0,0 +1,101 @@ +--- +title: font-style +slug: Web/CSS/@font-face/font-style +tags: + - CSS + - Descripteur + - Reference +translation_of: Web/CSS/@font-face/font-style +--- +
{{CSSRef}}
+ +

Le descripteur font-style, associé à la règle @ {{cssxref("@font-face")}}, permet d'indiquer le style de police pour la police définie via la règle.

+ +

Pour une police donnée (un ensemble de fontes), les auteurs peuvent télécharger plusieurs fichiers correspondant à la même police mais pour différents styles. Le descripteur font-style peut alors être utilisé afin d'indiquer explicitement le style associé à la fonte. La valeur du descripteur correspond à la propriété de la fonte.

+ +

Syntaxe

+ +
+
font-style: normal;
+font-style: italic;
+font-style: oblique;
+font-style: oblique 30deg;
+font-style: oblique 30deg 50deg;
+ +

Valeurs

+ +
+
normal
+
C'est la fonte « normale » de la police qui est choisie.
+
italic
+
C'est la fonte italique de la police qui est choisie.
+
oblique
+
C'est la fonte, artificiellement penchée à partir de la police normale, de la police qui est choisie.
+
oblique avec un angle
+
C'est la fonte oblique (c'est-à-dire une version artificiellement penchée, obtenue à partir de la police normale) de la police qui est choisie. L'angle indiqué correspond à la pente du texte.
+
oblique avec un intervalle d'angle
+
Utilise une fonte comme oblique et indique un intervalle d'angles possibles pour la pente du texte. On notera que l'intervalle est uniquement pris en compte pour la valeur oblique, aucune autre valeur n'est autorisée après normal ou italic.
+
+ +

Syntaxe formelle

+ +
{{csssyntax}}
+ +

Exemples

+ +

Dans les exemples qui suivent, on utilisera les différentes formes liées à la police Garamond :

+ +
@font-face {
+  font-family: garamond;
+  src: url('garamond.ttf');
+}
+ +

unstyled Garamond

+ +

La version en italique du texte utilisera les mêmes glyphes que la version normale, artificiellement penchés de quelques degrés.

+ +

artificially sloped garamond

+ +

En revanche, si on dispose d'une vraie version italique, on peut l'indiquer via le descripteur src et indiquer que c'est une police italique via font-style. Une « vraie » police italique utilisera des glyphes différents et la qualité calligraphique obtenue sera meilleure qu'avec les glyphes normaux penchés artificiellement.

+ +
@font-face {
+  font-family: garamond;
+  src: url('garamond-italic.ttf');
+  /* On indique ici que la police est italique */
+  font-style: italic;
+}
+ +

italic garamond

+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('CSS4 Fonts', '#font-prop-desc', 'font-style')}}{{Spec2('CSS4 Fonts')}}Ajoute la possibilité d'utiliser le mot-clé oblique suivi par une valeur angulaire.
{{SpecName('CSS3 Fonts', '#font-prop-desc', 'font-style')}}{{Spec2('CSS3 Fonts')}}Définition initiale.
+ +

{{cssinfo}}

+ +

Compatibilité des navigateurs

+ + + +

{{Compat("css.at-rules.font-face.font-style")}}

+
-- cgit v1.2.3-54-g00ecf