diff options
Diffstat (limited to 'files/fr/web/css/font-variant/index.md')
| -rw-r--r-- | files/fr/web/css/font-variant/index.md | 142 |
1 files changed, 60 insertions, 82 deletions
diff --git a/files/fr/web/css/font-variant/index.md b/files/fr/web/css/font-variant/index.md index 86e59df336..69a6f8120f 100644 --- a/files/fr/web/css/font-variant/index.md +++ b/files/fr/web/css/font-variant/index.md @@ -7,107 +7,85 @@ tags: - Reference translation_of: Web/CSS/font-variant --- -<div>{{CSSRef}}</div> +{{CSSRef}} -<p>La propriété <strong><code>font-variant</code></strong> est une propriété raccourcie représentant les propriétés : {{cssxref("font-variant-caps")}}, {{cssxref("font-variant-numeric")}}, {{cssxref("font-variant-alternates")}}, {{cssxref("font-variant-ligatures")}} et {{cssxref("font-variant-east-asian")}}. On peut aussi utiliser les valeurs de la propriété <code>font-variant</code> définies avec CSS Level 2 (<code>normal</code> ou <code>small-caps</code>), en utilisant la propriété raccourcie {{cssxref("font")}}.</p> +La propriété **`font-variant`** est une propriété raccourcie représentant les propriétés : {{cssxref("font-variant-caps")}}, {{cssxref("font-variant-numeric")}}, {{cssxref("font-variant-alternates")}}, {{cssxref("font-variant-ligatures")}} et {{cssxref("font-variant-east-asian")}}. On peut aussi utiliser les valeurs de la propriété `font-variant` définies avec CSS Level 2 (`normal` ou `small-caps`), en utilisant la propriété raccourcie {{cssxref("font")}}. -<div>{{EmbedInteractiveExample("pages/css/font-variant.html")}}</div> +{{EmbedInteractiveExample("pages/css/font-variant.html")}} -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="brush:css no-line-numbers">font-variant: small-caps; +```css +font-variant: small-caps; font-variant: common-ligatures small-caps; /* Valeurs globales */ font-variant: inherit; font-variant: initial; font-variant: unset; -</pre> - -<h3 id="Valeurs">Valeurs</h3> - -<dl> - <dt><code>normal</code></dt> - <dd>Définit une police normale ; chacune des propriétés individuelles a une valeur initiale de <code>normal</code>. Ces propriétés sont {{cssxref("font-variant-caps")}}, {{cssxref("font-variant-numeric")}}, {{cssxref("font-variant-alternates")}}, {{cssxref("font-variant-ligatures")}}, et {{cssxref("font-variant-east-asian")}}.</dd> - <dt><code>none</code></dt> - <dd>Définit la valeur de {{cssxref("font-variant-ligatures")}} comme étant <code>none</code> et les valeurs des autres propriétés à <code>normal</code>, leur valeur initiale.</dd> - <dt><common-lig-values>, <discretionary-lig-values>, <historical-lig-values>, <contextual-alt-values></dt> - <dd>Définit la valeur de la propriété {{cssxref("font-variant-ligatures")}}. Les valeurs possibles sont: <code>common-ligatures</code>,<code>no-common-ligatures</code>, <code>discretionary-ligatures</code>, <code>no-discretionary-ligatures</code>, <code>historical-ligatures</code>, <code>no-historical-ligatures</code>,<code>contextual</code>, et <code>no-contextual</code>.</dd> - <dt><code>stylistic()</code>, <code>historical-forms</code>, <code>styleset()</code>, <code>character-variant()</code>, <code>swash()</code>, <code>ornaments()</code>, <code>annotation()</code></dt> - <dd>Définit les mots-clés et fonctions relatives à la propriété {{cssxref("font-variant-alternates")}}.</dd> - <dt><code>small-caps</code>, <code>all-small-caps</code>, <code>petite-caps</code>, <code>all-petite-caps</code>, <code>unicase</code>, <code>titling-caps</code></dt> - <dd>Définit le mot-clé relatif à la propriété {{cssxref("font-variant-caps")}}.</dd> - <dt><code><numeric-figure-values></code>, <code><numeric-spacing-values></code>, <code><numeric-fraction-values></code>, <code>ordinal</code>, <code>slashed-zero</code></dt> - <dd>Définit la valeur de la propriété {{cssxref("font-variant-numeric")}}. Les valeurs possibles sont <code>lining-nums</code>,<code> oldstyle-nums</code>, <code>proportional-nums</code>, <code>tabular-nums</code>, <code>diagonal-fractions</code>, <code>stacked-fractions</code>, <code>ordinal</code>, et <code>slashed-zero.</code></dd> - <dt><code><east-asian-variant-values></code>, <code><east-asian-width-values></code>, <code>ruby</code></dt> - <dd>Définit la valeur de la propriété {{cssxref("font-variant-east-asian")}}. Les valeurs possibles sont: <code>jis78</code>, <code>jis83</code>,<code>jis90</code>, <code>jis04</code>, <code>simplified</code>, <code>traditional</code>, <code>full-width</code>, <code>proportional-width</code>, <code>ruby</code>.</dd> -</dl> - -<h3 id="Syntaxe_formelle">Syntaxe formelle</h3> +``` + +### Valeurs + +- `normal` + - : Définit une police normale ; chacune des propriétés individuelles a une valeur initiale de `normal`. Ces propriétés sont {{cssxref("font-variant-caps")}}, {{cssxref("font-variant-numeric")}}, {{cssxref("font-variant-alternates")}}, {{cssxref("font-variant-ligatures")}}, et {{cssxref("font-variant-east-asian")}}. +- `none` + - : Définit la valeur de {{cssxref("font-variant-ligatures")}} comme étant `none` et les valeurs des autres propriétés à `normal`, leur valeur initiale. +- \<common-lig-values>, \<discretionary-lig-values>, \<historical-lig-values>, \<contextual-alt-values> + - : Définit la valeur de la propriété {{cssxref("font-variant-ligatures")}}. Les valeurs possibles sont: `common-ligatures`,`no-common-ligatures`, `discretionary-ligatures`, `no-discretionary-ligatures`, `historical-ligatures`, `no-historical-ligatures`,`contextual`, et `no-contextual`. +- `stylistic()`, `historical-forms`, `styleset()`, `character-variant()`, `swash()`, `ornaments()`, `annotation()` + - : Définit les mots-clés et fonctions relatives à la propriété {{cssxref("font-variant-alternates")}}. +- `small-caps`, `all-small-caps`, `petite-caps`, `all-petite-caps`, `unicase`, `titling-caps` + - : Définit le mot-clé relatif à la propriété {{cssxref("font-variant-caps")}}. +- `<numeric-figure-values>`, `<numeric-spacing-values>`, `<numeric-fraction-values>`, `ordinal`, `slashed-zero` + - : Définit la valeur de la propriété {{cssxref("font-variant-numeric")}}. Les valeurs possibles sont `lining-nums`,` oldstyle-nums`, `proportional-nums`, `tabular-nums`, `diagonal-fractions`, `stacked-fractions`, `ordinal`, et `slashed-zero.` +- `<east-asian-variant-values>`, `<east-asian-width-values>`, `ruby` + - : Définit la valeur de la propriété {{cssxref("font-variant-east-asian")}}. Les valeurs possibles sont: `jis78`, `jis83`,`jis90`, `jis04`, `simplified`, `traditional`, `full-width`, `proportional-width`, `ruby`. + +### Syntaxe formelle {{csssyntax}} -<h2 id="Exemples">Exemples</h2> +## Exemples -<h3 id="HTML">HTML</h3> +### HTML -<pre class="brush: html"><p class="normal">Firefox normal</p> -<p class="small">Firefox petit</p> -</pre> +```html +<p class="normal">Firefox normal</p> +<p class="small">Firefox petit</p> +``` -<h3 id="CSS">CSS</h3> +### CSS -<pre class="brush: css">p.normal { +```css +p.normal { font-variant: normal; } p.small { font-variant: small-caps; } -</pre> - -<h3 id="Résultat">Résultat</h3> - -<p>{{EmbedLiveSample('Exemples', '', '', '', 'Web/CSS/font-variant')}}</p> - -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaires</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS3 Fonts', '#propdef-font-variant', 'font-variant')}}</td> - <td>{{Spec2('CSS3 Fonts')}}</td> - <td>La propriété est désormais une propriété raccourcie pour les nouvelles propriétés <code>font-variant-*</code>.</td> - </tr> - <tr> - <td>{{SpecName('CSS2.1', 'fonts.html#propdef-font-variant', 'font-variant')}}</td> - <td>{{Spec2('CSS2.1')}}</td> - <td>Aucun changement.</td> - </tr> - <tr> - <td>{{SpecName('CSS1', '#font-variant', 'font-variant')}}</td> - <td>{{Spec2('CSS1')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> - -<p>{{cssinfo}}</p> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{Compat("css.properties.font-variant")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li>{{cssxref("text-transform")}}</li> - <li>{{cssxref("text-combine-upright")}}</li> - <li>{{cssxref("text-orientation")}}</li> -</ul> +``` + +### Résultat + +{{EmbedLiveSample('Exemples', '', '', '', 'Web/CSS/font-variant')}} + +## Spécifications + +| Spécification | État | Commentaires | +| ------------------------------------------------------------------------------------------------ | -------------------------------- | ---------------------------------------------------------------------------------------------------- | +| {{SpecName('CSS3 Fonts', '#propdef-font-variant', 'font-variant')}} | {{Spec2('CSS3 Fonts')}} | La propriété est désormais une propriété raccourcie pour les nouvelles propriétés `font-variant-*`. | +| {{SpecName('CSS2.1', 'fonts.html#propdef-font-variant', 'font-variant')}} | {{Spec2('CSS2.1')}} | Aucun changement. | +| {{SpecName('CSS1', '#font-variant', 'font-variant')}} | {{Spec2('CSS1')}} | Définition initiale. | + +{{cssinfo}} + +## Compatibilité des navigateurs + +{{Compat("css.properties.font-variant")}} + +## Voir aussi + +- {{cssxref("text-transform")}} +- {{cssxref("text-combine-upright")}} +- {{cssxref("text-orientation")}} |