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-position/index.md | 150 ++++++++++------------ 1 file changed, 69 insertions(+), 81 deletions(-) (limited to 'files/fr/web/css/text-underline-position/index.md') diff --git a/files/fr/web/css/text-underline-position/index.md b/files/fr/web/css/text-underline-position/index.md index 80c9d9ab1c..5a8b5a22b0 100644 --- a/files/fr/web/css/text-underline-position/index.md +++ b/files/fr/web/css/text-underline-position/index.md @@ -7,11 +7,12 @@ tags: - Reference translation_of: Web/CSS/text-underline-position --- -
{{CSSRef}}
+{{CSSRef}} -

La propriété text-underline-position définit la position du soulignement utilisé lorsque la propriété {{cssxref("text-decoration")}} prend la valeur underline.

+La propriété **`text-underline-position`** définit la position du soulignement utilisé lorsque la propriété {{cssxref("text-decoration")}} prend la valeur `underline`. -
/* Avec un mot-clé */
+```css
+/* Avec un mot-clé */
 text-underline-position: auto;
 text-underline-position: under;
 text-underline-position: left;
@@ -25,58 +26,59 @@ text-underline-position: right under;
 text-underline-position: inherit;
 text-underline-position: initial;
 text-underline-position: unset;
-
+``` -

Cette propriété est héritée sur les différents éléments et n'est pas réinitialisée avec la propriété raccourcie {{cssxref("text-decoration")}}, ce qui permet de la définir simplement pour l'ensemble du document.

+Cette propriété est héritée sur les différents éléments et n'est pas réinitialisée avec la propriété raccourcie {{cssxref("text-decoration")}}, ce qui permet de la définir simplement pour l'ensemble du document. -
:root {
+```css
+:root {
   /* Une meilleure règle par défaut pour un document */
   /* avec de nombreuses formules chimiques */
   text-underline-position: under;
 }
-
- -

Syntaxe

- -

Valeurs

- -
-
auto
-
Ce mot-clé permet à l'agent utilisateur d'utiliser un algorithme pour choisir entre under et alphabetic.
-
under
-
Ce mot-clé force la ligne à se situer sous la ligne de base, à une position où elle ne traversera pas de jambage. Cela est notamment utile lorsqu'on veut souligner de façon lisible des formules chimiques ou mathématiques (qui utilisent fréquemment des indices).
-
left
-
In vertical writing-modes, this keyword forces the line to be placed on the left of the characters. In horizontal writing-modes, it is a synonym of under.
-
right
-
Pour les modes d'écritures verticaux, ce mot-clé force la ligne à être placée à droite des caractères. Pour les modes d'écritures horizontaux, ce mot-clé est synonyme de under.
-
auto-pos{{non-standard_inline}}
-
Ce mot-clé est synonyme de auto et c'est ce dernier qui doit être utilisé à la place.
-
above{{non-standard_inline}}
-
Ce mot-clé force la ligne à être dessinée au dessus du texte. Lorsqu'on écrit avec un script d'Asie orientale, la valeur auto aura un effet semblable.
-
below{{non-standard_inline}}
-
Ce mot-clé force la ligne à être dessinée sous le texte. Lorsqu'on utilise un texte alphabétique, la valeur auto aura un effet semblable.
-
- -

Syntaxe formelle

+``` + +## Syntaxe + +### Valeurs + +- `auto` + - : Ce mot-clé permet à l'agent utilisateur d'utiliser un algorithme pour choisir entre `under` et `alphabetic`. +- `under` + - : Ce mot-clé force la ligne à se situer sous la ligne de base, à une position où elle ne traversera pas de [jambage](https://fr.wikipedia.org/wiki/Jambage). Cela est notamment utile lorsqu'on veut souligner de façon lisible des formules chimiques ou mathématiques (qui utilisent fréquemment des indices). +- `left` + - : In vertical writing-modes, this keyword forces the line to be placed on the _left_ of the characters. In horizontal writing-modes, it is a synonym of `under.` +- `right` + - : Pour les modes d'écritures verticaux, ce mot-clé force la ligne à être placée à droite des caractères. Pour les modes d'écritures horizontaux, ce mot-clé est synonyme de `under.` +- `auto-pos`{{non-standard_inline}} + - : Ce mot-clé est synonyme de `auto` et c'est ce dernier qui doit être utilisé à la place. +- `above`{{non-standard_inline}} + - : Ce mot-clé force la ligne à être dessinée au dessus du texte. Lorsqu'on écrit avec un script d'Asie orientale, la valeur `auto` aura un effet semblable. +- `below`{{non-standard_inline}} + - : Ce mot-clé force la ligne à être dessinée sous le texte. Lorsqu'on utilise un texte alphabétique, la valeur `auto` aura un effet semblable. + +### Syntaxe formelle {{csssyntax}} -

Exemples

+## Exemples -

HTML

+### HTML -
<p class="chimique">
-  C<sub>6</sub>H<sub>12</sub>O<sub>6</sub>
-</p>
-<p class="defaut">
-  Et là avec des <sub>indices</sub>
+```html
+

+  C6H12O6
+

+

+  Et là avec des indices
   et du jambage
-</p>
-
+

+``` -

CSS

+### CSS -
.chimique {
+```css
+.chimique {
   text-decoration: underline;
   text-underline-position: under;
 }
@@ -84,43 +86,29 @@ text-underline-position: unset;
 .defaut {
   text-decoration: underline;
   text-underline-position: auto;
-}
- -

Résultat

- -

{{EmbedLiveSample("Exemples","100%","100%")}}

- -

Spécifications

- - - - - - - - - - - - - - - - -
SpécificationStatutCommentaires
{{SpecName('CSS3 Text Decoration', '#text-underline-position-property', 'text-underline-position')}}{{Spec2('CSS3 Text Decoration')}}Définition initiale.
- -

{{cssinfo}}

- -

Compatibilité des navigateurs

- -

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

- -

Voir aussi

- - +} +``` + +### Résultat + +{{EmbedLiveSample("Exemples","100%","100%")}} + +## Spécifications + +| Spécification | Statut | Commentaires | +| ------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------- | -------------------- | +| {{SpecName('CSS3 Text Decoration', '#text-underline-position-property', 'text-underline-position')}} | {{Spec2('CSS3 Text Decoration')}} | Définition initiale. | + +{{cssinfo}} + +## Compatibilité des navigateurs + +{{Compat("css.properties.text-underline-position")}} + +## Voir aussi + +- {{cssxref("text-decoration")}} +- {{cssxref("text-decoration-line")}} +- {{cssxref("text-decoration-style")}} +- {{cssxref("text-decoration-color")}} +- [La documentation sur les valeurs non-standard utilisées par Microsoft](https://msdn.microsoft.com/en-us/library/ie/ms531176%28v=vs.85%29.aspx) -- cgit v1.2.3-54-g00ecf