aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/css/-webkit-mask-repeat-x
diff options
context:
space:
mode:
authorjulieng <julien.gattelier@gmail.com>2021-09-17 20:59:20 +0200
committerSphinxKnight <SphinxKnight@users.noreply.github.com>2021-10-12 07:57:33 +0200
commit258ba7b4be62d8640477a3bd3146d08b00cb70ec (patch)
treea8476eee4c369ff47bdfe08353774414f2281ba3 /files/fr/web/css/-webkit-mask-repeat-x
parent149319bb8c7b1394a443f0877c3460cd362aa815 (diff)
downloadtranslated-content-258ba7b4be62d8640477a3bd3146d08b00cb70ec.tar.gz
translated-content-258ba7b4be62d8640477a3bd3146d08b00cb70ec.tar.bz2
translated-content-258ba7b4be62d8640477a3bd3146d08b00cb70ec.zip
convert content to md
Diffstat (limited to 'files/fr/web/css/-webkit-mask-repeat-x')
-rw-r--r--files/fr/web/css/-webkit-mask-repeat-x/index.md65
1 files changed, 32 insertions, 33 deletions
diff --git a/files/fr/web/css/-webkit-mask-repeat-x/index.md b/files/fr/web/css/-webkit-mask-repeat-x/index.md
index 0669e8a600..b2568be318 100644
--- a/files/fr/web/css/-webkit-mask-repeat-x/index.md
+++ b/files/fr/web/css/-webkit-mask-repeat-x/index.md
@@ -8,11 +8,12 @@ tags:
- Reference
translation_of: Web/CSS/-webkit-mask-repeat-x
---
-<div>{{CSSRef}}{{Non-standard_header}}</div>
+{{CSSRef}}{{Non-standard_header}}
-<p>La propriété <strong><code>-webkit-mask-repeat-x</code></strong> définit la façon dont une image de masque est répétée horizontalement.</p>
+La propriété **`-webkit-mask-repeat-x`** définit la façon dont une image de masque est répétée horizontalement.
-<pre class="brush:css no-line-numbers">/* Valeurs avec un mot-clé */
+```css
+/* Valeurs avec un mot-clé */
-webkit-mask-repeat-x: repeat;
-webkit-mask-repeat-x: no-repeat;
-webkit-mask-repeat-x: space;
@@ -25,30 +26,29 @@ translation_of: Web/CSS/-webkit-mask-repeat-x
-webkit-mask-repeat-x: inherit;
-webkit-mask-repeat-x: initial;
-webkit-mask-repeat-x: unset;
-</pre>
+```
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
-<h3 id="Valeurs">Valeurs</h3>
+### Valeurs
-<dl>
- <dt><code>repeat</code></dt>
- <dd>L'image de masque est répétée horizontalement.</dd>
- <dt><code>no-repeat</code></dt>
- <dd>L'image de masque n'est pas répétée horizontalement, seul un exemplaire est dessiné selon l'axe horizontal. Le contenu restant sur l'axe horizontal pour les éléments masqués n'est pas affiché.</dd>
- <dt><code>space</code></dt>
- <dd>L'image est répétée tant que possible sans être rognée. La première et la dernière images sont accolées aux bords droit et gauche de l'élément et l'espace restant est réparti entre les copies de l'image. La propriété {{cssxref("mask-position")}} est ignorée sauf si une seule image peut être affichée sans qu'il n'y ait de rognage. On aura uniquement du rognage s'il n'y a pas suffisamment d'espace pour afficher une seule image.</dd>
- <dt><code>round</code></dt>
- <dd>L'image est répétée et les différents exemplaires sont tous étirés de la même façon afin qu'il n'y ait pas d'espace entre chaque. Ainsi, une image qui mesure originellement 260px et qui est répétée trois fois pourra être étirée jusqu'à ce que chaque répétition soit large de 300px, ensuite une autre image sera ajoutée et toutes seront compressées à 225px.</dd>
-</dl>
+- `repeat`
+ - : L'image de masque est répétée horizontalement.
+- `no-repeat`
+ - : L'image de masque n'est pas répétée horizontalement, seul un exemplaire est dessiné selon l'axe horizontal. Le contenu restant sur l'axe horizontal pour les éléments masqués n'est pas affiché.
+- `space`
+ - : L'image est répétée tant que possible sans être rognée. La première et la dernière images sont accolées aux bords droit et gauche de l'élément et l'espace restant est réparti entre les copies de l'image. La propriété {{cssxref("mask-position")}} est ignorée sauf si une seule image peut être affichée sans qu'il n'y ait de rognage. On aura uniquement du rognage s'il n'y a pas suffisamment d'espace pour afficher une seule image.
+- `round`
+ - : L'image est répétée et les différents exemplaires sont tous étirés de la même façon afin qu'il n'y ait pas d'espace entre chaque. Ainsi, une image qui mesure originellement 260px et qui est répétée trois fois pourra être étirée jusqu'à ce que chaque répétition soit large de 300px, ensuite une autre image sera ajoutée et toutes seront compressées à 225px.
-<h3 id="Syntaxe_formelle">Syntaxe formelle</h3>
+### Syntaxe formelle
{{csssyntax}}
-<h2 id="Exemples">Exemples</h2>
+## Exemples
-<pre class="brush: css">.exempleun {
+```css
+.exempleun {
-webkit-mask-image: url('mask.png');
-webkit-mask-repeat-x: repeat;
}
@@ -57,29 +57,28 @@ translation_of: Web/CSS/-webkit-mask-repeat-x
-webkit-mask-image: url('mask.png');
-webkit-mask-repeat-x: no-repeat;
}
-</pre>
+```
-<h3 id="Gestion_de_plusieurs_images">Gestion de plusieurs images</h3>
+### Gestion de plusieurs images
-<p>On peut définir un style de répétition (<code>&lt;repeat-style&gt;</code>) différent pour chacune des images de masque en séparant les valeurs par des virgules :</p>
+On peut définir un style de répétition (`<repeat-style>`) différent pour chacune des images de masque en séparant les valeurs par des virgules :
-<pre class="brush: css">.exempletrois {
+```css
+.exempletrois {
-webkit-mask-image: url('mask1.png'), url('mask2.png');
-webkit-mask-repeat-x: repeat, space;
}
-</pre>
+```
-<p>Chaque image aura la valeur associée, dans le même ordre.</p>
+Chaque image aura la valeur associée, dans le même ordre.
-<p>{{cssinfo}}</p>
+{{cssinfo}}
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
-<p>{{Compat("css.properties.-webkit-mask-repeat-x")}}</p>
+{{Compat("css.properties.-webkit-mask-repeat-x")}}
-<h2 id="Voir_aussi">Voir aussi</h2>
+## Voir aussi
-<ul>
- <li>{{cssxref("-webkit-mask-repeat")}},</li>
- <li>{{cssxref("-webkit-mask-repeat-y")}}</li>
-</ul>
+- {{cssxref("-webkit-mask-repeat")}},
+- {{cssxref("-webkit-mask-repeat-y")}}