diff options
Diffstat (limited to 'files/fr/web/svg')
-rw-r--r-- | files/fr/web/svg/applying_svg_effects_to_html_content/index.html (renamed from files/fr/web/svg/application_d_effets_svg_a_du_contenu_html/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/compatibility_sources/index.html (renamed from files/fr/web/svg/sources_compatibilite/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/svg_1.1_support_in_firefox/index.html | 774 | ||||
-rw-r--r-- | files/fr/web/svg/svg_as_an_image/index.html (renamed from files/fr/web/svg/svg_en_tant_qu_image/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/basic_shapes/index.html (renamed from files/fr/web/svg/tutoriel/formes_de_base/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/basic_transformations/index.html (renamed from files/fr/web/svg/tutoriel/transformations_de_base/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/clipping_and_masking/index.html (renamed from files/fr/web/svg/tutoriel/découpages_et_masquages/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/fills_and_strokes/index.html (renamed from files/fr/web/svg/tutoriel/fills_and_strokes/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/filter_effects/index.html (renamed from files/fr/web/svg/tutoriel/filtres/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/getting_started/index.html (renamed from files/fr/web/svg/tutoriel/premiers_pas/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/gradients/index.html (renamed from files/fr/web/svg/tutoriel/gradients/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/index.html (renamed from files/fr/web/svg/tutoriel/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/introduction/index.html (renamed from files/fr/web/svg/tutoriel/introduction/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/other_content_in_svg/index.html (renamed from files/fr/web/svg/tutoriel/contenu_embarque_svg/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/paths/index.html (renamed from files/fr/web/svg/tutoriel/paths/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/patterns/index.html (renamed from files/fr/web/svg/tutoriel/motifs/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/positions/index.html (renamed from files/fr/web/svg/tutoriel/positionnement/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/svg_and_css/index.html | 198 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/svg_fonts/index.html (renamed from files/fr/web/svg/tutoriel/polices_svg/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/svg_image_tag/index.html (renamed from files/fr/web/svg/tutoriel/svg_image_tag/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/svg_in_html_introduction/index.html (renamed from files/fr/web/svg/tutoriel/introduction_à_svg_dans_html/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/texts/index.html (renamed from files/fr/web/svg/tutoriel/texts/index.html) | 0 | ||||
-rw-r--r-- | files/fr/web/svg/tutorial/tools_for_svg/index.html (renamed from files/fr/web/svg/tutoriel/tools_for_svg/index.html) | 0 |
23 files changed, 972 insertions, 0 deletions
diff --git a/files/fr/web/svg/application_d_effets_svg_a_du_contenu_html/index.html b/files/fr/web/svg/applying_svg_effects_to_html_content/index.html index cb06ea5315..cb06ea5315 100644 --- a/files/fr/web/svg/application_d_effets_svg_a_du_contenu_html/index.html +++ b/files/fr/web/svg/applying_svg_effects_to_html_content/index.html diff --git a/files/fr/web/svg/sources_compatibilite/index.html b/files/fr/web/svg/compatibility_sources/index.html index 49f69f68a7..49f69f68a7 100644 --- a/files/fr/web/svg/sources_compatibilite/index.html +++ b/files/fr/web/svg/compatibility_sources/index.html diff --git a/files/fr/web/svg/svg_1.1_support_in_firefox/index.html b/files/fr/web/svg/svg_1.1_support_in_firefox/index.html new file mode 100644 index 0000000000..36e4340b97 --- /dev/null +++ b/files/fr/web/svg/svg_1.1_support_in_firefox/index.html @@ -0,0 +1,774 @@ +--- +title: SVG dans Firefox +slug: SVG_dans_Firefox +tags: + - SVG +translation_of: Web/SVG/SVG_1.1_Support_in_Firefox +--- +<p>Vous trouverez des exemples simples de syntaxe et d'utilisation de SVG sur la page <a class="external" href="http://www.w3.org/Graphics/SVG/Test/20061213/">W3C SVG test suite</a>.</p> + +<h2 id="Statut_d.27impl.C3.A9mentation_des_.C3.A9l.C3.A9ments" name="Statut_d.27impl.C3.A9mentation_des_.C3.A9l.C3.A9ments">Statut d'implémentation des éléments</h2> + +<ul> + <li>SVGPathSegList Interface + <ul> + <li>Liaisons non implémentées : replaceItem()</li> + </ul> + </li> +</ul> + +<table class="standard-table" style="border-collapse: separate;"> + <tbody> + <tr> + <th>Élément</th> + <th>Notes</th> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#basic-structure-mod">Structure Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SVGElement">svg</a></td> + <td> + <ul> + <li>Implémenté.</li> + <li>Les attributs DOM <code>currentScale</code> et <code>currentTranslate</code> sont implémentés, mais il n'y a pas d'interface utilisateur pour se déplacer et zoomer.</li> + <li>SVGSVGElement + <ul> + <li>Attributs non implémentés : contentScriptType, contentStyleType, viewport, useCurrentView, currentView</li> + <li>Liaisons non implémentées : pauseAnimations, unpauseAnimations, animationsPaused, getCurrentTime, setCurrentTime, getIntersectionList, getEnclosureList, checkIntersection, checkEnclosure, deselectAll,</li> + <li><del>createSVGAngle</del> (implémenté dans Firefox 2), getElementById</li> + </ul> + </li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#GElement">g</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#DefsElement">defs</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#DescElement">desc</a></td> + <td> + <ul> + <li>Implémenté.</li> + <li>Uniquement stocké dans le DOM, pas d'interface utilisateur.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#TitleElement">title</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/metadata.html#MetadataElement">metadata</a></td> + <td> + <ul> + <li>Implémenté.</li> + <li>Uniquement stocké dans le DOM, pas d'interface utilisateur.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SymbolElement">symbol</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#UseElement">use</a></td> + <td> + <ul> + <li>Implémenté.</li> + <li>Fonctionne uniquement pour les références internes au document ({{ Bug(269482) }}).</li> + <li>Ne suit pas entièrement les règles de cascade <svg:use> ({{ Bug(265894) }}).</li> + <li>Ne délivre pas les évènements à un arbre SVGElementInstance ({{ Bug(265895) }}).</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#conditional-mod">Conditional Processing Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SwitchElement">switch</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#image-mod">Image Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement">image</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/styling.html#style-mod">Style Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/styling.html#StyleElement">style</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#shape-mod">Shape Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/paths.html#PathElement">path</a></td> + <td> + <ul> + <li>Implémenté.</li> + <li>SVGPathElement Interface + <ul> + <li>Attributs non implémentés : pathLength, normalizedPathSegList, animatedPathSegList, animatedNormalizedPathSegList</li> + <li>Liaisons non implémentées : getTotalLength,</li> + <li><del>getPointAtLength</del> (implémenté dans Firefox 2), getPathSegAtLength</li> + </ul> + </li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement">rect</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#CircleElement">circle</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#LineElement">line</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#EllipseElement">ellipse</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#PolylineElement">polyline</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#PolygonElement">polygon</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/text.html#text-mod">Text Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TextElement">text</a></td> + <td> + <ul> + <li>Implémenté.</li> + <li>SVGTextElement + <ul> + <li>Attributs non implémentés : rotate, textLength, lengthAdjust</li> + <li>Liaisons non implémentées : getNumberOfChars, getSubStringLength, getStartPositionOfChar, getEndPositionOfChar, getRotationOfChar, getCharNumAtPosition, selectSubString</li> + <li>Liaisons non fonctionnelles au cours de <code>onload</code> : getExtentOfChar</li> + </ul> + </li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TSpanElement">tspan</a></td> + <td> + <ul> + <li>Implémenté.</li> + <li>SVGTSpanElement + <ul> + <li>Attributs non implémentés : rotate, textLength, lengthAdjust</li> + <li>Liaisons non implémentées : getNumberOfChars,</li> + <li><del>getComputedTextLength</del> (implémenté dans Firefox 2), getSubStringLength, getStartPositionOfChar, getEndPositionOfChar, getExtentOfChar, getRotationOfChar, getCharNumAtPosition, selectSubString</li> + </ul> + </li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td style="background-color: rgb(204,204,204);"><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TRefElement">tref</a></td> + <td style="background-color: rgb(204,204,204);"> + <ul> + <li>Cette fonctionnalité se trouvait dans les premiers projets de spec et a été retirée par la suite, elle n'est donc pas implémentée</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TextPathElement">textPath</a></td> + <td> + <ul> + <li>Implémenté dans Firefox 2.</li> + <li>Attributs non implémentés : method, spacing, textLength, lengthAdjust</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphElement">altGlyph</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphDefElement">altGlyphDef</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphItemElement">altGlyphItem</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#GlyphRefElement">glyphRef</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/painting.html#marker-mod">Marker Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/painting.html#MarkerElement">marker</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/color.html#color-profile-mod">Color Profile Module</a></th> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/color.html#ColorProfileElement">color-profile</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#gradient-mod">Gradient Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#LinearGradientElement">linearGradient</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#RadialGradientElement">radialGradient</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#StopElement">stop</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#pattern-mod">Pattern Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#PatternElement">pattern</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#clip-mod">Clip Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#ClipPathElement">clipPath</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#mask-mod">Mask Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#MaskElement">mask</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#filter-mod">Filter Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#FilterElement">filter</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feBlendElement">feBlend</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feColorMatrixElement">feColorMatrix</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feComponentTransferElement">feComponentTransfer</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feCompositeElement">feComposite</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feConvolveMatrixElement">feConvolveMatrix</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDiffuseLightingElement">feDiffuseLighting</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDisplacementMapElement">feDisplacementMap</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFloodElement">feFlood</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feGaussianBlurElement">feGaussianBlur</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feImageElement">feImage</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMergeElement">feMerge</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMergeNodeElement">feMergeNode</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMorphologyElement">feMorphology</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feOffsetElement">feOffset</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feSpecularLightingElement">feSpecularLighting</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feTileElement">feTile</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feTurbulenceElement">feTurbulence</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDistantLightElement">feDistantLight</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#fePointLightElement">fePointLight</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feSpotLightElement">feSpotLight</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncRElement">feFuncR</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncGElement">feFuncG</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncBElement">feFuncB</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncAElement">feFuncA</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/interact.html#cursor-mod">Cursor Module</a></th> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/interact.html#CursorElement">cursor</a></td> + <td> + <ul> + <li>Non implémenté ({{Bug(177193)}}).</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#hyperlinking-mod">Hyperlinking Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#AElement">a</a></td> + <td> + <ul> + <li>Implémenté comme une liaison XBL - l'objet n'est pas du type SVGAElement.</li> + <li>Seuls les attributs <code>xlink:href</code> et <code>xlink:show</code> sont implémentés.</li> + <li>Pour l'attribut <code>target</code>, voir le {{ Bug(300868) }}</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#view-mod">View Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#ViewElement">view</a></td> + <td> + <ul> + <li>Implémenté dans Gecko 15.0 ({{Bug(512525)}}). {{gecko_minversion_inline("15.0")}}.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/script.html#scripting-mod">Scripting Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/script.html#ScriptElement">script</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#animation-mod">Animation Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateElement">animate</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#SetElement">set</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateMotionElement">animateMotion</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateTransformElement">animateTransform</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateColorElement">animateColor</a></td> + <td> + <ul> + <li>Non implémenté ({{Bug(436296)}}).</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#mpathElement">mpath</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#font-mod">Font Module</a></th> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceElement">font</a></td> + <td> + <ul> + <li>Non implémenté ({{Bug(119490)}}).</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#GlyphElement">glyph</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#MissingGlyphElement">missing-glyph</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#HKernElement">hkern</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#VKernElement">vkern</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceSrcElement">font-face-src</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-uri</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-format</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-name</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr style="color: black; background-color: salmon;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#DefinitionSrcElement">definition-src</a></td> + <td> + <ul> + <li>Non implémenté.</li> + </ul> + </td> + </tr> + <tr> + <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/extend.html#extensibility-mod">Extensibility Module</a></th> + </tr> + <tr style="color: black; background-color: lightgreen;"> + <td><a class="external" href="http://www.w3.org/TR/SVG11/extend.html#ForeignObjectElement">foreignObject</a></td> + <td> + <ul> + <li>Implémenté.</li> + </ul> + </td> + </tr> + </tbody> +</table> + +<p> </p> diff --git a/files/fr/web/svg/svg_en_tant_qu_image/index.html b/files/fr/web/svg/svg_as_an_image/index.html index e7acc660e0..e7acc660e0 100644 --- a/files/fr/web/svg/svg_en_tant_qu_image/index.html +++ b/files/fr/web/svg/svg_as_an_image/index.html diff --git a/files/fr/web/svg/tutoriel/formes_de_base/index.html b/files/fr/web/svg/tutorial/basic_shapes/index.html index aa75f0c0ed..aa75f0c0ed 100644 --- a/files/fr/web/svg/tutoriel/formes_de_base/index.html +++ b/files/fr/web/svg/tutorial/basic_shapes/index.html diff --git a/files/fr/web/svg/tutoriel/transformations_de_base/index.html b/files/fr/web/svg/tutorial/basic_transformations/index.html index 2015cab83c..2015cab83c 100644 --- a/files/fr/web/svg/tutoriel/transformations_de_base/index.html +++ b/files/fr/web/svg/tutorial/basic_transformations/index.html diff --git a/files/fr/web/svg/tutoriel/découpages_et_masquages/index.html b/files/fr/web/svg/tutorial/clipping_and_masking/index.html index a4dd82b1dc..a4dd82b1dc 100644 --- a/files/fr/web/svg/tutoriel/découpages_et_masquages/index.html +++ b/files/fr/web/svg/tutorial/clipping_and_masking/index.html diff --git a/files/fr/web/svg/tutoriel/fills_and_strokes/index.html b/files/fr/web/svg/tutorial/fills_and_strokes/index.html index 54e0d792e2..54e0d792e2 100644 --- a/files/fr/web/svg/tutoriel/fills_and_strokes/index.html +++ b/files/fr/web/svg/tutorial/fills_and_strokes/index.html diff --git a/files/fr/web/svg/tutoriel/filtres/index.html b/files/fr/web/svg/tutorial/filter_effects/index.html index b0f988398a..b0f988398a 100644 --- a/files/fr/web/svg/tutoriel/filtres/index.html +++ b/files/fr/web/svg/tutorial/filter_effects/index.html diff --git a/files/fr/web/svg/tutoriel/premiers_pas/index.html b/files/fr/web/svg/tutorial/getting_started/index.html index 83dee73b6c..83dee73b6c 100644 --- a/files/fr/web/svg/tutoriel/premiers_pas/index.html +++ b/files/fr/web/svg/tutorial/getting_started/index.html diff --git a/files/fr/web/svg/tutoriel/gradients/index.html b/files/fr/web/svg/tutorial/gradients/index.html index ef9c235318..ef9c235318 100644 --- a/files/fr/web/svg/tutoriel/gradients/index.html +++ b/files/fr/web/svg/tutorial/gradients/index.html diff --git a/files/fr/web/svg/tutoriel/index.html b/files/fr/web/svg/tutorial/index.html index 14275fcdd8..14275fcdd8 100644 --- a/files/fr/web/svg/tutoriel/index.html +++ b/files/fr/web/svg/tutorial/index.html diff --git a/files/fr/web/svg/tutoriel/introduction/index.html b/files/fr/web/svg/tutorial/introduction/index.html index 7c38618958..7c38618958 100644 --- a/files/fr/web/svg/tutoriel/introduction/index.html +++ b/files/fr/web/svg/tutorial/introduction/index.html diff --git a/files/fr/web/svg/tutoriel/contenu_embarque_svg/index.html b/files/fr/web/svg/tutorial/other_content_in_svg/index.html index ecaf0e7d60..ecaf0e7d60 100644 --- a/files/fr/web/svg/tutoriel/contenu_embarque_svg/index.html +++ b/files/fr/web/svg/tutorial/other_content_in_svg/index.html diff --git a/files/fr/web/svg/tutoriel/paths/index.html b/files/fr/web/svg/tutorial/paths/index.html index 2b73ee2682..2b73ee2682 100644 --- a/files/fr/web/svg/tutoriel/paths/index.html +++ b/files/fr/web/svg/tutorial/paths/index.html diff --git a/files/fr/web/svg/tutoriel/motifs/index.html b/files/fr/web/svg/tutorial/patterns/index.html index 29a63e8f60..29a63e8f60 100644 --- a/files/fr/web/svg/tutoriel/motifs/index.html +++ b/files/fr/web/svg/tutorial/patterns/index.html diff --git a/files/fr/web/svg/tutoriel/positionnement/index.html b/files/fr/web/svg/tutorial/positions/index.html index 7f23bfe123..7f23bfe123 100644 --- a/files/fr/web/svg/tutoriel/positionnement/index.html +++ b/files/fr/web/svg/tutorial/positions/index.html diff --git a/files/fr/web/svg/tutorial/svg_and_css/index.html b/files/fr/web/svg/tutorial/svg_and_css/index.html new file mode 100644 index 0000000000..a3c323972f --- /dev/null +++ b/files/fr/web/svg/tutorial/svg_and_css/index.html @@ -0,0 +1,198 @@ +--- +title: Graphiques SVG +slug: CSS/Premiers_pas/Graphiques_SVG +tags: + - CSS + - 'CSS:Premiers_pas' +translation_of: Web/SVG/Tutorial/SVG_and_CSS +--- +<p> </p> +<p>Cette page illustre le langage spécialisé dans la création d'éléments graphiques : SVG.</p> +<p>Vous créerez une démonstration simple visible dans votre navigateur Mozilla avec SVG activé.</p> +<h3 id="Information_:_SVG" name="Information_:_SVG">Information : SVG</h3> +<p> + <i> + SVG</i> + (Scalable Vector Graphics) est un langage basé sur XML permettant de créer des éléments graphiques.</p> +<p>Il peut être utilisé pour des images statiques, ainsi que pour des animations et des interfaces utilisateur.</p> +<p>Comme d'autres langages basés sur XML, SVG permet d'utiliser des feuilles de style CSS afin de séparer le style d'un graphique de son contenu.</p> +<p>De plus, les feuilles de style utilisées avec d'autres langages de balisages peuvent spécifier l'URL d'un graphique SVG lorsqu'une image est requise. Par exemple, une feuille de style utilisée avec un document HTML peut spécifier l'URL d'un graphique SVG dans la valeur d'une propriété <code>background</code>.</p> +<table style="border: 1px solid #36b; padding: 1em; background-color: #f4f4f4; margin-bottom: 1em; width: 100%;"> + <caption> + Plus de détails</caption> + <tbody> + <tr> + <td>Au moment de la rédaction de ce document (courant 2005), seules certains compilations récentes des navigateurs Mozilla ont leur gestion native de SVG activée. + <p>Vous pouvez ajouter un support SVG à d'autres versions en installant un plugin comme celui fourni par <a class="external" href="http://www.adobe.com/svg/viewer/install/main.html">Adobe</a>.</p> + <p>Pour plus d'informations à propos de SVG dans Mozilla, consultez la page <a href="fr/SVG">SVG</a> de ce wiki.</p> + </td> + </tr> + </tbody> +</table> +<h3 id="Action_:_une_d.C3.A9monstration_de_SVG" name="Action_:_une_d.C3.A9monstration_de_SVG">Action : une démonstration de SVG</h3> +<p>Créez un nouveau document SVG en tant que fichier texte simple, <code>doc8.svg</code>. Copiez et collez-y le contenu ci-dessous en vous assurant de le faire défiler afin d'en obtenir la totalité :</p> +<div style="width: 48em; height: 12em; overflow: auto;"> + <pre><?xml version="1.0" standalone="no"?> + +<?xml-stylesheet type="text/css" href="style8.css"?> + +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" + "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> + +<svg width="600px" height="600px" viewBox="-300 -300 600 600" + xmlns="http://www.w3.org/2000/svg" version="1.1" + xmlns:xlink="http://www.w3.org/1999/xlink"> + +<title>SVG demonstration</title> +<desc>Premiers pas en CSS avec Mozilla - Démonstration de SVG</desc> + +<defs> + <g id="segment" class="segment"> + <path class="segment-fill" d="M0,0 v-200 a40,40 0 0,0 -62,10 z"/> + <path class="segment-edge" d="M0,-200 a40,40 0 0,0 -62,10"/> + </g> + <g id="quadrant"> + <use xlink:href="#segment"/> + <use xlink:href="#segment" transform="rotate(18)"/> + <use xlink:href="#segment" transform="rotate(36)"/> + <use xlink:href="#segment" transform="rotate(54)"/> + <use xlink:href="#segment" transform="rotate(72)"/> + </g> + <g id="petals"> + <use xlink:href="#quadrant"/> + <use xlink:href="#quadrant" transform="rotate(90)"/> + <use xlink:href="#quadrant" transform="rotate(180)"/> + <use xlink:href="#quadrant" transform="rotate(270)"/> + </g> + <radialGradient id="fade" cx="0" cy="0" r="200" + gradientUnits="userSpaceOnUse"> + <stop id="fade-stop-1" offset="33%"/> + <stop id="fade-stop-2" offset="95%"/> + </radialGradient> + </defs> + +<text id="heading" x="-280" y="-270"> + SVG demonstration</text> +<text id="caption" x="-280" y="-250"> + Placez le pointeur de la souris au dessus de la fleur.</text> + +<g id="flower"> + <circle id="overlay" cx="0" cy="0" r="200" + stroke="none" fill="url(#fade)"/> + <use id="outer-petals" xlink:href="#petals"/> + <use id="inner-petals" xlink:href="#petals" + transform="rotate(9) scale(0.33)"/> + </g> + +</svg> +</pre> +</div> +<p>Créez un nouveau fichier CSS, <code>style8.css</code>. Copiez et collez-y le contenu ci-dessous, en vous assurant de le faire défiler pour en obtenir la totalité :</p> +<div style="width: 48em; height: 12em; overflow: auto;"> + <pre>/*** Démonstration de SVG ***/ + +/* page */ +svg { + background-color: beige; + } + +#heading { + font-size: 24px; + font-weight: bold; + } + +#caption { + font-size: 12px; + } + +/* flower */ +#flower:hover { + cursor: crosshair; + } + +/* gradient */ +#fade-stop-1 { + stop-color: blue; + } + +#fade-stop-2 { + stop-color: white; + } + +/* outer petals */ +#outer-petals { + opacity: .75; + } + +#outer-petals .segment-fill { + fill: azure; + stroke: lightsteelblue; + stroke-width: 1; + } + +#outer-petals .segment-edge { + fill: none; + stroke: deepskyblue; + stroke-width: 3; + } + +#outer-petals .segment:hover > .segment-fill { + fill: plum; + stroke: none; + } + +#outer-petals .segment:hover > .segment-edge { + stroke: slateblue; + } + +/* inner petals */ +#inner-petals .segment-fill { + fill: yellow; + stroke: yellowgreen; + stroke-width: 1; + } + +#inner-petals .segment-edge { + fill: none; + stroke: yellowgreen; + stroke-width: 9; + } + +#inner-petals .segment:hover > .segment-fill { + fill: darkseagreen; + stroke: none; + } + +#inner-petals .segment:hover > .segment-edge { + stroke: green; + } +</pre> +</div> +<p>Ouvrez le document dans votre navigateur avec SVG activé. Placez le pointeur de la souris au dessus de l'image.</p> +<p>Ce wiki ne permet pas d'utiliser SVG dans ses pages, il n'est donc pas possible d'afficher la démonstration ici. L'image ressemble à ceci :</p> +<table style="border: 2px outset #36b;"> + <tbody> + <tr> + <td><img alt="Démonstration de SVG"></td> + </tr> + </tbody> +</table> +<p>Remarques à propos de cette démonstration :</p> +<ul> + <li>Le document SVG est lié à la feuille de style de la manière habituelle.</li> + <li>SVG possède ses propres propriétés CSS et valeurs. Certaines d'entre-elles sont similaires au propriétés CSS pour HTML.</li> +</ul> +<p> </p> +<table style="border: 1px solid #36b; padding: 1em; background-color: #fffff4; margin-bottom: 1em;"> + <caption> + Challenge</caption> + <tbody> + <tr> + <td>Modifiez la feuille de style pour que les pétales intérieurs deviennent tous roses lorsque le pointeur de la souris survole n'importe lequel d'entre-eux, sans changer la manière dont les pétales extérieurs fonctionnent.</td> + </tr> + </tbody> +</table> +<p> </p> +<h4 id="Pour_continuer" name="Pour_continuer">Pour continuer</h4> +<p>Si vous avez eu des difficultés à comprendre cette page, ou si vous avez d'autres commentaires à son sujet, n'hésitez pas à contribuer à sa <a>page de discussion</a>.</p> +<p>Dans cette démonstration, votre navigateur avec SVG activé sait déjà comment afficher les éléments SVG. La feuille de style modifie uniquement l'affichage dans une certaine mesure. C'est également le cas pour les documents HTML et XUL. Mais vous pouvez utiliser CSS pour des documents XML généralistes, où il n'y a aucune manière prédéfinie d'afficher les éléments. La page suivante en fait la démonstration : <b><a href="/fr/docs/CSS/Premiers_pas/Donn%c3%a9es_XML">Données XML</a></b>.</p> diff --git a/files/fr/web/svg/tutoriel/polices_svg/index.html b/files/fr/web/svg/tutorial/svg_fonts/index.html index 4a196a3825..4a196a3825 100644 --- a/files/fr/web/svg/tutoriel/polices_svg/index.html +++ b/files/fr/web/svg/tutorial/svg_fonts/index.html diff --git a/files/fr/web/svg/tutoriel/svg_image_tag/index.html b/files/fr/web/svg/tutorial/svg_image_tag/index.html index 8912c059d0..8912c059d0 100644 --- a/files/fr/web/svg/tutoriel/svg_image_tag/index.html +++ b/files/fr/web/svg/tutorial/svg_image_tag/index.html diff --git a/files/fr/web/svg/tutoriel/introduction_à_svg_dans_html/index.html b/files/fr/web/svg/tutorial/svg_in_html_introduction/index.html index 29db7cb55b..29db7cb55b 100644 --- a/files/fr/web/svg/tutoriel/introduction_à_svg_dans_html/index.html +++ b/files/fr/web/svg/tutorial/svg_in_html_introduction/index.html diff --git a/files/fr/web/svg/tutoriel/texts/index.html b/files/fr/web/svg/tutorial/texts/index.html index 97871407d2..97871407d2 100644 --- a/files/fr/web/svg/tutoriel/texts/index.html +++ b/files/fr/web/svg/tutorial/texts/index.html diff --git a/files/fr/web/svg/tutoriel/tools_for_svg/index.html b/files/fr/web/svg/tutorial/tools_for_svg/index.html index f60f06c76f..f60f06c76f 100644 --- a/files/fr/web/svg/tutoriel/tools_for_svg/index.html +++ b/files/fr/web/svg/tutorial/tools_for_svg/index.html |