From 258ba7b4be62d8640477a3bd3146d08b00cb70ec Mon Sep 17 00:00:00 2001 From: julieng Date: Fri, 17 Sep 2021 20:59:20 +0200 Subject: convert content to md --- files/fr/web/css/text-underline-offset/index.md | 96 +++++++++++-------------- 1 file changed, 41 insertions(+), 55 deletions(-) (limited to 'files/fr/web/css/text-underline-offset') diff --git a/files/fr/web/css/text-underline-offset/index.md b/files/fr/web/css/text-underline-offset/index.md index 332cc62d99..82e69bab77 100644 --- a/files/fr/web/css/text-underline-offset/index.md +++ b/files/fr/web/css/text-underline-offset/index.md @@ -7,19 +7,18 @@ tags: - Reference translation_of: Web/CSS/text-underline-offset --- -
{{CSSRef}}
+{{CSSRef}} -

La propriété CSS text-underline-offset définit le décalage de la ligne de décoration du texte par rapport à sa position originale.

+La propriété CSS **`text-underline-offset`** définit le décalage de la ligne de décoration du texte par rapport à sa position originale. -
{{EmbedInteractiveExample("pages/css/text-underline-offset.html")}}
+{{EmbedInteractiveExample("pages/css/text-underline-offset.html")}} -
-

Note : text-underline-offset n'est pas une propriété détaillée de {{cssxref('text-decoration')}}. Bien qu'un élément puisse avoir plusieurs lignes décoratives, text-underline-offset n'aura qu'un impact sur le soulignage (et pas sur les autres lignes telles que celles fournies par {{cssxref('text-decoration-line')}} avec overline ou line-through).

-
+> **Note :** `text-underline-offset` n'est pas une propriété détaillée de {{cssxref('text-decoration')}}. Bien qu'un élément puisse avoir plusieurs lignes décoratives, `text-underline-offset` n'aura qu'un impact sur le soulignage (et pas sur les autres lignes telles que celles fournies par {{cssxref('text-decoration-line')}} avec `overline` ou `line-through`). -

Syntaxe

+## Syntaxe -
/* Valeur simple */
+```css
+/* Valeur simple */
 text-underline-offset: none;
 text-underline-offset: from-font;
 text-underline-offset: 0.2em;
@@ -28,30 +27,29 @@ text-underline-offset: 0.2em;
 text-underline-offset: inherit;
 text-underline-offset: initial;
 text-underline-offset: unset;
-
+``` -

La propriété text-underline-offset est définie avec le mot-clé none ou avec une valeur de la liste suivante.

+La propriété `text-underline-offset` est définie avec le mot-clé `none` ou avec une valeur de la liste suivante. -

Valeurs

+### Valeurs -
-
auto
-
Le navigateur choisit un décalage approprié pour le soulignage.
-
from-font
-
Si le fichier de fonte inclut des informations quant à un décalage préféré, c'est cette valeur qui sera utilisée. Si le fichier de fonte n'a pas cette information, cette valeur se comportera comme auto.
-
<length>
-
Une longueur (valeur de type {{cssxref("<length>")}}) indiquant le décalage à utiliser. Il est recommandé d'utiliser des em comme unité afin que le décalage suive la taille de la police (quand on zoome par exemple).
-
+- `auto` + - : Le navigateur choisit un décalage approprié pour le soulignage. +- `from-font` + - : Si le fichier de fonte inclut des informations quant à un décalage préféré, c'est cette valeur qui sera utilisée. Si le fichier de fonte n'a pas cette information, cette valeur se comportera comme `auto`. +- `` + - : Une longueur (valeur de type {{cssxref("<length>")}}) indiquant le décalage à utiliser. Il est recommandé d'utiliser des [`em`](/fr/docs/Web/CSS/length#em) comme unité afin que le décalage suive la taille de la police (quand on zoome par exemple). -

Syntaxe formelle

+### Syntaxe formelle {{csssyntax}} -

Exemples

+## Exemples -

CSS

+### CSS -
p {
+```css
+p {
   text-decoration-line: underline;
   text-decoration-style: wavy;
   text-decoration-color: red;
@@ -60,49 +58,37 @@ text-underline-offset: unset;
 
 .deuxlignes{
   text-decoration-line: underline overline;
-}
+} +``` -

HTML

+### HTML -
<p class="uneligne">
+```html
+

   Voici un texte souligné avec une ligne ondulée rouge !
-</p>
-<p class="deuxlignes">
+

+

   Ce texte a une ligne en dessous et une ligne au dessus.
   Seule la ligne du dessous est déplacée.
-</p>
+

+``` -

Résultat

+### Résultat -

{{EmbedLiveSample('Exemples', '', '', '')}}

+{{EmbedLiveSample('Exemples', '', '', '')}} -

Spécifications

+## Spécifications - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('CSS4 Text Decoration', '#underline-offset', 'text-underline-offset')}}{{Spec2('CSS4 Text Decoration')}}Définition initiale.
+| Spécification | État | Commentaires | +| ------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------- | -------------------- | +| {{SpecName('CSS4 Text Decoration', '#underline-offset', 'text-underline-offset')}} | {{Spec2('CSS4 Text Decoration')}} | Définition initiale. | -

{{cssinfo}}

+{{cssinfo}} -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("css.properties.text-underline-offset")}}

+{{Compat("css.properties.text-underline-offset")}} -

Voir aussi

+## Voir aussi - +- {{cssxref("text-decoration")}} -- cgit v1.2.3-54-g00ecf