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/text-underline-offset/index.html | 112 ++++++++++++++++++++++ 1 file changed, 112 insertions(+) create mode 100644 files/fr/web/css/text-underline-offset/index.html (limited to 'files/fr/web/css/text-underline-offset') diff --git a/files/fr/web/css/text-underline-offset/index.html b/files/fr/web/css/text-underline-offset/index.html new file mode 100644 index 0000000000..b62f7eb7e6 --- /dev/null +++ b/files/fr/web/css/text-underline-offset/index.html @@ -0,0 +1,112 @@ +--- +title: text-underline-offset +slug: Web/CSS/text-underline-offset +tags: + - CSS + - Propriété + - Reference +translation_of: Web/CSS/text-underline-offset +--- +
{{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.

+ +
{{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).

+
+ +

Syntaxe

+ +
/* Valeur simple */
+text-underline-offset: none;
+text-underline-offset: from-font;
+text-underline-offset: 0.2em;
+
+/* Valeurs globales */
+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.

+ +

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).
+
+ +

Syntaxe formelle

+ +
{{csssyntax}}
+ +

Exemples

+ +

CSS

+ +
p {
+  text-decoration-line: underline;
+  text-decoration-style: wavy;
+  text-decoration-color: red;
+  text-underline-offset: 1em;
+}
+
+.deuxlignes{
+  text-decoration-line: underline overline;
+}
+ +

HTML

+ +
<p class="uneligne">
+  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

+ +

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

+ +

Spécifications

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

{{cssinfo}}

+ +

Compatibilité des navigateurs

+ + + +

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

+ +

Voir aussi

+ + -- cgit v1.2.3-54-g00ecf