aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/svg/attribute/stroke/index.md
diff options
context:
space:
mode:
authorjulieng <julien.gattelier@gmail.com>2021-11-01 07:51:45 +0100
committerSphinxKnight <SphinxKnight@users.noreply.github.com>2021-11-07 11:57:29 +0100
commit88dda3c00eefc18a29447e99ebd3177925602b52 (patch)
treea184ddfe3825b6f05cba6d7586ea05c9375558a0 /files/fr/web/svg/attribute/stroke/index.md
parent7040e4bc9c98e0c50ce903a5cbeeabeda2ed908a (diff)
downloadtranslated-content-88dda3c00eefc18a29447e99ebd3177925602b52.tar.gz
translated-content-88dda3c00eefc18a29447e99ebd3177925602b52.tar.bz2
translated-content-88dda3c00eefc18a29447e99ebd3177925602b52.zip
convert content to md
Diffstat (limited to 'files/fr/web/svg/attribute/stroke/index.md')
-rw-r--r--files/fr/web/svg/attribute/stroke/index.md119
1 files changed, 52 insertions, 67 deletions
diff --git a/files/fr/web/svg/attribute/stroke/index.md b/files/fr/web/svg/attribute/stroke/index.md
index 01e3b44595..15d964e62f 100644
--- a/files/fr/web/svg/attribute/stroke/index.md
+++ b/files/fr/web/svg/attribute/stroke/index.md
@@ -6,88 +6,73 @@ tags:
- SVG
translation_of: Web/SVG/Attribute/stroke
---
-<div>{{SVGRef}}</div>
+{{SVGRef}}
-<p>L'attribut <strong><code>stroke</code></strong> définit la couleur (ou n'importe quelle méthode de remplissage, comme un gradient ou motif) a utiliser pour dessiner le contour d'une forme SVG.</p>
+L'attribut **`stroke`** définit la couleur (ou n'importe quelle méthode de remplissage, comme un gradient ou motif) a utiliser pour dessiner le contour d'une forme SVG.
-<div class="note">
- <p><strong>Note :</strong> <code>stroke</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
-</div>
+> **Note :** `stroke` étant un attribut de présentation, il peut être utilisé comme propriété CSS.
-<p>Cet attribut peut être appliqué à tout élément, en revanche il n'aura d'effet que sur les éléments suivants: {{SVGElement('altGlyph')}}, {{SVGElement('circle')}}, {{SVGElement('ellipse')}}, {{SVGElement('path')}}, {{SVGElement('polygon')}}, {{SVGElement('polyline')}}, {{SVGElement('rect')}}, {{SVGElement('text')}}, {{SVGElement('textPath')}}, {{SVGElement('tref')}}, and {{SVGElement('tspan')}}</p>
+Cet attribut peut être appliqué à tout élément, en revanche il n'aura d'effet que sur les éléments suivants: {{SVGElement('altGlyph')}}, {{SVGElement('circle')}}, {{SVGElement('ellipse')}}, {{SVGElement('path')}}, {{SVGElement('polygon')}}, {{SVGElement('polyline')}}, {{SVGElement('rect')}}, {{SVGElement('text')}}, {{SVGElement('textPath')}}, {{SVGElement('tref')}}, and {{SVGElement('tspan')}}
-<h2>Exemple</h2>
+## Exemple
-<pre class="brush: css hidden">html,body,svg { height:100% }</pre>
+```css hidden
+html,body,svg { height:100% }
+```
-<pre class="brush: html">&lt;svg viewBox="0 0 20 10" xmlns="http://www.w3.org/2000/svg"&gt;
+```html
+<svg viewBox="0 0 20 10" xmlns="http://www.w3.org/2000/svg">
- &lt;!-- Simple trait de couleur --&gt;
- &lt;circle cx="5" cy="5" r="4" fill="none"
- stroke="green" /&gt;
+ <!-- Simple trait de couleur -->
+ <circle cx="5" cy="5" r="4" fill="none"
+ stroke="green" />
- &lt;!-- Utiliser un degradé comme contour --&gt;
- &lt;defs&gt;
- &lt;linearGradient id="myGradient"&gt;
- &lt;stop offset="0%" stop-color="green" /&gt;
- &lt;stop offset="100%" stop-color="white" /&gt;
- &lt;/linearGradient&gt;
- &lt;/defs&gt;
- &lt;circle cx="15" cy="5" r="4" fill="none"
- stroke="url(#myGradient)" /&gt;
-&lt;/svg&gt;
-</pre>
+ <!-- Utiliser un degradé comme contour -->
+ <defs>
+ <linearGradient id="myGradient">
+ <stop offset="0%" stop-color="green" />
+ <stop offset="100%" stop-color="white" />
+ </linearGradient>
+ </defs>
+ <circle cx="15" cy="5" r="4" fill="none"
+ stroke="url(#myGradient)" />
+</svg>
+```
-<p>{{EmbedLiveSample('exemple', '100%', 200)}}</p>
+{{EmbedLiveSample('exemple', '100%', 200)}}
-<h2 id="Notes_d'usage">Notes d'usage</h2>
+## Notes d'usage
<table class="standard-table">
- <tbody>
- <tr>
- <th scope="row">Valeur</th>
- <td><strong><a href="/docs/Web/SVG/Content_type#Paint">&lt;paint&gt;</a></strong></td>
- </tr>
- <tr>
- <th scope="row">Valeur par défaut</th>
- <td><code>none</code></td>
- </tr>
- <tr>
- <th scope="row">Animation</th>
- <td>Oui</td>
- </tr>
- </tbody>
+ <tbody>
+ <tr>
+ <th scope="row">Valeur</th>
+ <td>
+ <strong
+ ><a href="/docs/Web/SVG/Content_type#Paint">&#x3C;paint></a></strong
+ >
+ </td>
+ </tr>
+ <tr>
+ <th scope="row">Valeur par défaut</th>
+ <td><code>none</code></td>
+ </tr>
+ <tr>
+ <th scope="row">Animation</th>
+ <td>Oui</td>
+ </tr>
+ </tbody>
</table>
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Spécification</th>
- <th scope="col">Statut</th>
- <th scope="col">Commentaire</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{SpecName("SVG2", "painting.html#StrokeProperty", "stroke")}}</td>
- <td>{{Spec2("SVG2")}}</td>
- <td>Définition pour les formes et le texte.<br>
- Ajoute <code>context-fill</code> et <code>context-stroke</code>.</td>
- </tr>
- <tr>
- <td>{{SpecName("SVG1.1", "painting.html#StrokeProperty", "stroke")}}</td>
- <td>{{Spec2("SVG1.1")}}</td>
- <td>Définiton initiale pour les formes et le texte</td>
- </tr>
- </tbody>
-</table>
+| Spécification | Statut | Commentaire |
+| ------------------------------------------------------------------------------------ | ------------------------ | ---------------------------------------------------------------------------------- |
+| {{SpecName("SVG2", "painting.html#StrokeProperty", "stroke")}} | {{Spec2("SVG2")}} | Définition pour les formes et le texte. Ajoute `context-fill` et `context-stroke`. |
+| {{SpecName("SVG1.1", "painting.html#StrokeProperty", "stroke")}} | {{Spec2("SVG1.1")}} | Définiton initiale pour les formes et le texte |
-<h2 id="Browser_Compatibility">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
-<p>{{Compat("svg.attributes.presentation.stroke")}}</p>
+{{Compat("svg.attributes.presentation.stroke")}}
-<div class="note">
- <p><strong>Note :</strong> Pour plus d'informations sur les valeurs de <code>context-stroke</code> (et <code>context-fill</code>) à partir de documents HTML, voir la documentation pour la propriété non-standard {{cssxref("-moz-context-properties")}}.</p>
-</div>
+> **Note :** Pour plus d'informations sur les valeurs de `context-stroke` (et `context-fill`) à partir de documents HTML, voir la documentation pour la propriété non-standard {{cssxref("-moz-context-properties")}}.