From b8c44785e41b3f24efd88dcfa0613c9a098c4be3 Mon Sep 17 00:00:00 2001 From: Theophile Avoyne Date: Sat, 8 May 2021 14:46:29 +0200 Subject: Grammar mistakes (#784) * Grammar mistakes * Review + macro conversion and english IDs Co-authored-by: julieng --- .../svg/attribute/preserveaspectratio/index.html | 76 +++++++++++----------- 1 file changed, 38 insertions(+), 38 deletions(-) (limited to 'files') diff --git a/files/fr/web/svg/attribute/preserveaspectratio/index.html b/files/fr/web/svg/attribute/preserveaspectratio/index.html index b433de89fd..7d5ffb6db1 100644 --- a/files/fr/web/svg/attribute/preserveaspectratio/index.html +++ b/files/fr/web/svg/attribute/preserveaspectratio/index.html @@ -8,33 +8,33 @@ translation_of: Web/SVG/Attribute/preserveAspectRatio ---
{{SVGRef}}
-

L'attibut preserveAspectRatio indique comment un élément est mis à l'échelle lorsque le ratio largeur:hauteur du {{SVGAttr('viewBox')}} est différent du ratio de la zone d'affichage (définit par les attributs width et height).

+

L'attibut preserveAspectRatio indique comment un élément est mis à l'échelle lorsque le ratio largeur:hauteur de la viewBox est différent du ratio de la zone d'affichage (définit par les attributs width et height).

-

Parce que les proportions du SVG sont définis par l'attribut viewBox, si ce dernier n'est pas définit alors l'attribut preserveAspectRatio n'a aucun effet (à l'exception près de l'élément {{SVGElement('image')}} comme décrit ci-dessous).

+

Parce que les proportions du SVG sont définies par l'attribut viewBox, si ce dernier n'est pas défini alors l'attribut preserveAspectRatio n'a aucun effet (à l'exception près de l'élément <image> comme décrit ci-dessous).

-

Exemple

+

Exemple

<svg viewBox="-1 -1 162 92" xmlns="http://www.w3.org/2000/svg">
   <defs>
      <path id="smiley" d="M50,10 A40,40,1,1,1,50,90 A40,40,1,1,1,50,10 M30,40 Q36,35,42,40 M58,40 Q64,35,70,40 M30,60 Q50,75,70,60 Q50,75,30,60" />
   </defs>
 
-  <!-- (width>height) meet -->
+  <!-- (largeur>hauteur) meet -->
   <svg preserveAspectRatio="xMidYMid meet"  x="0"   y="0"  viewBox="0 0 100 100" width="20"  height="10"><use href="#smiley" /></svg>
   <svg preserveAspectRatio="xMinYMid meet"  x="25"  y="0"  viewBox="0 0 100 100" width="20"  height="10"><use href="#smiley" /></svg>
   <svg preserveAspectRatio="xMaxYMid meet"  x="50"  y="0"  viewBox="0 0 100 100" width="20"  height="10"><use href="#smiley" /></svg>
 
-  <!-- (width>height) slice -->
+  <!-- (largeur>hauteur) slice -->
   <svg preserveAspectRatio="xMidYMin slice" x="0"   y="15" viewBox="0 0 100 100" width="20"  height="10"><use href="#smiley" /></svg>
   <svg preserveAspectRatio="xMidYMid slice" x="25"  y="15" viewBox="0 0 100 100" width="20"  height="10"><use href="#smiley" /></svg>
   <svg preserveAspectRatio="xMidYMax slice" x="50"  y="15" viewBox="0 0 100 100" width="20"  height="10"><use href="#smiley" /></svg>
 
-  <!-- (width<height) meet -->
+  <!-- (largeur<hauteur) meet -->
   <svg preserveAspectRatio="xMidYMin meet"  x="75"  y="0"  viewBox="0 0 100 100" width="10"  height="25"><use href="#smiley" /></svg>
   <svg preserveAspectRatio="xMidYMid meet"  x="90"  y="0"  viewBox="0 0 100 100" width="10"  height="25"><use href="#smiley" /></svg>
   <svg preserveAspectRatio="xMidYMax meet"  x="105" y="0"  viewBox="0 0 100 100" width="10"  height="25"><use href="#smiley" /></svg>
 
-  <!-- (width<height) slice -->
+  <!-- (largeur<hauteur) slice -->
   <svg preserveAspectRatio="xMinYMid slice" x="120" y="0"  viewBox="0 0 100 100" width="10"  height="25"><use href="#smiley" /></svg>
   <svg preserveAspectRatio="xMidYMid slice" x="135" y="0"  viewBox="0 0 100 100" width="10"  height="25"><use href="#smiley" /></svg>
   <svg preserveAspectRatio="xMaxYMid slice" x="150" y="0"  viewBox="0 0 100 100" width="10"  height="25"><use href="#smiley" /></svg>
@@ -54,7 +54,7 @@ translation_of: Web/SVG/Attribute/preserveAspectRatio
      <path id="smiley" d="M50,10 A40,40,1,1,1,50,90 A40,40,1,1,1,50,10 M30,40 Q36,35,42,40 M58,40 Q64,35,70,40 M30,60 Q50,75,70,60 Q50,75,30,60" />
   </defs>
 
-  <!-- (width>height) meet -->
+  <!-- (largeur>hauteur) meet -->
   <rect x="0" y="0" width="20" height="10">
     <title>xMidYMid meet</title>
   </rect>
@@ -79,7 +79,7 @@ translation_of: Web/SVG/Attribute/preserveAspectRatio
     <use href="#smiley" />
   </svg>
 
-  <!-- (width>height) slice -->
+  <!-- (largeur>hauteur) slice -->
   <rect x="0" y="15" width="20" height="10">
     <title>xMidYMin slice</title>
   </rect>
@@ -104,7 +104,7 @@ translation_of: Web/SVG/Attribute/preserveAspectRatio
     <use href="#smiley" />
   </svg>
 
-  <!-- (width<height) meet -->
+  <!-- (largeur<hauteur) meet -->
   <rect x="75" y="0" width="10" height="25">
     <title>xMidYMin meet</title>
   </rect>
@@ -129,7 +129,7 @@ translation_of: Web/SVG/Attribute/preserveAspectRatio
     <use href="#smiley" />
   </svg>
 
-  <!-- (width<height) slice -->
+  <!-- (largeur<hauteur) slice -->
   <rect x="120" y="0" width="10" height="25">
     <title>xMinYMid slice</title>
   </rect>
@@ -165,30 +165,30 @@ translation_of: Web/SVG/Attribute/preserveAspectRatio
 </svg>
path {
-  fill: yellow;
-  stroke: black;
-  stroke-width: 8px;
-  stroke-linecap: round;
-  stroke-linejoin: round;
-  pointer-events: none;
+  fill: yellow;
+  stroke: black;
+  stroke-width: 8px;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  pointer-events: none;
 }
 
 rect:hover, rect:active {
-  outline: 1px solid red;
+  outline: 1px solid red;
 }

{{EmbedLiveSample('topExample', '100%', 200)}}

-

Syntaxe

+

Syntaxe

preserveAspectRatio="<align> [<meetOrSlice>]"
-

La valeur de l'attribut est constituée d'un ou deux mots clés: l'alignement et l'option "meet ou slice" (satisfaire ou trancher) comme décrit ci-dessous:

+

La valeur de l'attribut est constituée d'un ou deux mots clés : l'alignement et l'option "meet ou slice" (satisfaire ou trancher) comme décrit ci-dessous:

Alignement
-
L'alignement indique s'il faut forcer une mise à l'échelle uniforme et si oui, comment faire dans le cas où le rapport largeur:hauteur du {{ SVGAttr("viewBox") }} ne correspond pas à celui affiché. Les différentes valeurs possibles sont: +
L'alignement indique s'il faut forcer une mise à l'échelle uniforme et si oui, comment faire dans le cas où le rapport largeur:hauteur de la viewBox ne correspond pas à celui affiché. Les différentes valeurs possibles sont:
  • none
    Ne pas forcer la mise à l'échelle uniforme. Étirer le contenu de manière à ce que le contenu remplisse toute la hauteur et toute la largeur affichée. Notez que si <align> vaut none, alors la valeur <meetOrSlice> est ignorée.
  • @@ -227,28 +227,28 @@ rect:hover, rect:active {
  • meet (par défaut) - Mettre à l'échelle l'image tel que:
    • les proportions sont préservées
    • -
    • la {{ SVGAttr("viewBox") }} est entièrement visible dans la zone d'affichage
    • -
    • la {{ SVGAttr("viewBox") }} est agrandie autant que possible, tout en respectant les autres critères
    • +
    • la viewBox est entièrement visible dans la zone d'affichage
    • +
    • la viewBox est agrandie autant que possible, tout en respectant les autres critères
    - Autrement dit, si les proportions du contenu ne correspondent pas à la zone d'affichage, la zone d'affichage sera agrandie au-delà du {{ SVGAttr("viewBox") }} (la zone dans laquelle sera dessinée la {{ SVGAttr("viewBox") }} sera plus petite que la zone d'affichage).
  • + Autrement dit, si les proportions du contenu ne correspondent pas à la zone d'affichage, la zone d'affichage sera agrandie au-delà de la viewBox (la zone dans laquelle sera dessinée la viewBox sera plus petite que la zone d'affichage).
  • slice - Mettre à l'échelle l'image tel que:
    • les proportions sont préservées
    • -
    • la zone d'affichage est entièrement remplie par la {{ SVGAttr("viewBox") }}
    • -
    • la {{ SVGAttr("viewBox") }} est réduite autant que possible, tout en respectant les autres critères
    • +
    • la zone d'affichage est entièrement remplie par la viewBox
    • +
    • la viewBox est réduite autant que possible, tout en respectant les autres critères
    - Autrement dit, si les proportions du contenu ne correspondent pas à la zone d'affichage, la {{ SVGAttr("viewBox") }} sera agrandie au-delà de la zone d'affichage (la zone dans laquelle sera dessinée la {{ SVGAttr("viewBox") }} sera plus grande que la zone d'affichage).
  • + Autrement dit, si les proportions du contenu ne correspondent pas à la zone d'affichage, la viewBox sera agrandie au-delà de la zone d'affichage (la zone dans laquelle sera dessinée la viewBox sera plus grande que la zone d'affichage).
-

Éléments

+

Éléments

-

Sept éléments utilisent cet attribut: {{SVGElement("svg")}}, {{SVGElement("symbol")}}, {{SVGElement("image")}}, {{SVGElement("feImage")}}, {{SVGElement("marker")}}, {{SVGElement("pattern")}}, and {{SVGElement("view")}}.

+

Sept éléments utilisent cet attribut: <svg>, <symbol>, <image>, <feImage>, <marker>, <pattern>, and <view>.

feImage

-

Pour {{SVGElement('feImage')}}, preserveAspectRatio définit comment l'image doit être ajustée dans le rectangle défini par l'élément <feImage>.

+

Pour <feImage>, preserveAspectRatio définit comment l'image doit être ajustée dans le rectangle défini par l'élément <feImage>.

@@ -269,7 +269,7 @@ rect:hover, rect:active {

image

-

Pour {{SVGElement('feImage')}}, preserveAspectRatio définit comment l'image doit être ajustée dans le rectangle défini par l'élément <image>.

+

Pour <feImage>, preserveAspectRatio définit comment l'image doit être ajustée dans le rectangle défini par l'élément <image>.

@@ -290,7 +290,7 @@ rect:hover, rect:active {

marker

-

Pour {{SVGElement('marker')}}, preserveAspectRatio indique si une mise à l'échelle unifrome doit être effectuée pour s'adapter à la zone d'affichage.

+

Pour <marker>, preserveAspectRatio indique si une mise à l'échelle uniforme doit être effectuée pour s'adapter à la zone d'affichage.

@@ -311,7 +311,7 @@ rect:hover, rect:active {

pattern

-

Pour {{SVGElement('pattern')}}, preserveAspectRatio indique si une mise à l'échelle unifrome doit être effectuée pour s'adapter à la zone d'affichage.

+

Pour <pattern>, preserveAspectRatio indique si une mise à l'échelle uniforme doit être effectuée pour s'adapter à la zone d'affichage.

@@ -332,7 +332,7 @@ rect:hover, rect:active {

svg

-

Pour {{SVGElement('svg')}}, preserveAspectRatio indique si une mise à l'échelle unifrome doit être effectuée pour s'adapter à la zone d'affichage.

+

Pour <svg>, preserveAspectRatio indique si une mise à l'échelle uniforme doit être effectuée pour s'adapter à la zone d'affichage.

@@ -353,7 +353,7 @@ rect:hover, rect:active {

symbol

-

Pour {{SVGElement('symbol')}}, preserveAspectRatio indique si une mise à l'échelle unifrome doit être effectuée pour s'adapter à la zone d'affichage.

+

Pour <symbol>, preserveAspectRatio indique si une mise à l'échelle uniforme doit être effectuée pour s'adapter à la zone d'affichage.

@@ -374,7 +374,7 @@ rect:hover, rect:active {

view

-

Pour {{SVGElement('view')}}, preserveAspectRatio indique si une mise à l'échelle unifrome doit être effectuée pour s'adapter à la zone d'affichage.

+

Pour <view>, preserveAspectRatio indique si une mise à l'échelle uniforme doit être effectuée pour s'adapter à la zone d'affichage.

@@ -407,12 +407,12 @@ rect:hover, rect:active { - + - + -- cgit v1.2.3-54-g00ecf
{{SpecName("Filters 1.0", "#element-attrdef-feimage-preserveaspectratio", "preserveAspectRatio")}} {{Spec2('Filters 1.0')}} 
{{SpecName("SVG2", "coords.html#PreserveAspectRatioAttribute", "preserveAspectRatio")}} {{Spec2("SVG2")}} 
{{SpecName("SVG1.1", "coords.html#PreserveAspectRatioAttribute", "preserveAspectRatio")}}