diff options
author | julieng <julien.gattelier@gmail.com> | 2021-09-17 20:59:20 +0200 |
---|---|---|
committer | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2021-10-12 07:57:33 +0200 |
commit | 258ba7b4be62d8640477a3bd3146d08b00cb70ec (patch) | |
tree | a8476eee4c369ff47bdfe08353774414f2281ba3 /files/fr/web/css/@counter-style/pad | |
parent | 149319bb8c7b1394a443f0877c3460cd362aa815 (diff) | |
download | translated-content-258ba7b4be62d8640477a3bd3146d08b00cb70ec.tar.gz translated-content-258ba7b4be62d8640477a3bd3146d08b00cb70ec.tar.bz2 translated-content-258ba7b4be62d8640477a3bd3146d08b00cb70ec.zip |
convert content to md
Diffstat (limited to 'files/fr/web/css/@counter-style/pad')
-rw-r--r-- | files/fr/web/css/@counter-style/pad/index.md | 120 |
1 files changed, 53 insertions, 67 deletions
diff --git a/files/fr/web/css/@counter-style/pad/index.md b/files/fr/web/css/@counter-style/pad/index.md index a27313ddef..6a146050c7 100644 --- a/files/fr/web/css/@counter-style/pad/index.md +++ b/files/fr/web/css/@counter-style/pad/index.md @@ -7,90 +7,76 @@ tags: - Reference translation_of: Web/CSS/@counter-style/pad --- -<div>{{CSSRef}}</div> +{{CSSRef}} -<p>Le descripteur <strong><code>pad</code></strong>, utilisé dans la règle @ {{cssxref("@counter-style")}} peut être utilisé pour que la représentation du marqueur pour le compteur ait une longueur minimale. Si la représentation du marqueur est plus courte que la longueur indiquée, le marqueur sera complété autant de fois que nécessaire avec le symbole indiqué. Les représentations du marqueur qui sont plus longues que la longueur minimale indiquée dans le descripteur sont construites normalement.</p> +Le descripteur **`pad`**, utilisé dans la règle @ {{cssxref("@counter-style")}} peut être utilisé pour que la représentation du marqueur pour le compteur ait une longueur minimale. Si la représentation du marqueur est plus courte que la longueur indiquée, le marqueur sera complété autant de fois que nécessaire avec le symbole indiqué. Les représentations du marqueur qui sont plus longues que la longueur minimale indiquée dans le descripteur sont construites normalement. -<p>Le descripteur <code>pad</code> utilise deux paramètres :</p> +Le descripteur `pad` utilise deux paramètres : -<ul> - <li>un entier indiquant la longueur minimale de la représentation du marqueur</li> - <li>Le symbole utilisé pour compléter la représentation du marqueur si nécessaire.</li> -</ul> +- un entier indiquant la longueur minimale de la représentation du marqueur +- Le symbole utilisé pour compléter la représentation du marqueur si nécessaire. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="brush: css">pad: 3 "0"; -</pre> +```css +pad: 3 "0"; +``` -<h3 id="Valeurs">Valeurs</h3> +### Valeurs -<dl> - <dt><code><integer> && <symbol></code></dt> - <dd>La composante <code><integer></code> indique la longueur minimale du marqueur. La valeur doit être positive. Si la représentation du marqueur est plus courte, elle sera complétée avec la valeur indiquée par la composante <code><symbol></code>.</dd> -</dl> +- `<integer> && <symbol>` + - : La composante `<integer>` indique la longueur minimale du marqueur. La valeur doit être positive. Si la représentation du marqueur est plus courte, elle sera complétée avec la valeur indiquée par la composante `<symbol>`. -<h3 id="Syntaxe_formelle">Syntaxe formelle</h3> +### Syntaxe formelle {{csssyntax}} -<h2 id="Exemples">Exemples</h2> +## Exemples -<h3 id="CSS">CSS</h3> +### CSS -<pre class="brush: css">@counter-style pad-example { +```css +@counter-style pad-example { system: numeric; symbols: "0" "1" "2" "3" "4" "5"; pad: 2 "0"; } .exemple { list-style: pad-example; -}</pre> - -<h3 id="HTML">HTML</h3> - -<pre class="brush: html"><ul class="exemple"> - <li>Un</li> - <li>Deux</li> - <li>Trois</li> - <li>Quatre</li> - <li>Cinq</li> -</ul></pre> - -<h3 id="Résultat">Résultat</h3> - -<p>{{EmbedLiveSample('Exemples')}}</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 Counter Styles', '#descdef-counter-style-pad', 'pad')}}</td> - <td>{{Spec2('CSS3 Counter Styles')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> - -<p>{{cssinfo}}</p> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{Compat("css.at-rules.counter-style.pad")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li>{{cssxref("list-style")}},</li> - <li>{{cssxref("list-style-image")}},</li> - <li>{{cssxref("list-style-position")}},</li> - <li>{{cssxref("symbols", "symbols()")}}, la notation fonctionnelle qui permet de créer des styles de compteur anonymes.</li> +} +``` + +### HTML + +```html +<ul class="exemple"> + <li>Un</li> + <li>Deux</li> + <li>Trois</li> + <li>Quatre</li> + <li>Cinq</li> </ul> +``` + +### Résultat + +{{EmbedLiveSample('Exemples')}} + +## Spécifications + +| Spécification | État | Commentaires | +| ------------------------------------------------------------------------------------------------ | -------------------------------------------- | -------------------- | +| {{SpecName('CSS3 Counter Styles', '#descdef-counter-style-pad', 'pad')}} | {{Spec2('CSS3 Counter Styles')}} | Définition initiale. | + +{{cssinfo}} + +## Compatibilité des navigateurs + +{{Compat("css.at-rules.counter-style.pad")}} + +## Voir aussi + +- {{cssxref("list-style")}}, +- {{cssxref("list-style-image")}}, +- {{cssxref("list-style-position")}}, +- {{cssxref("symbols", "symbols()")}}, la notation fonctionnelle qui permet de créer des styles de compteur anonymes. |