fix(css): rephrase vriable font example proes (#37258)

* fix(css): rephrase vriable font example proes * Update files/en-us/web/css/css_fonts/variable_fonts_guide/index.md * Apply suggestions from code review Co-authored-by: Chris Mills <[email protected]> --------- Co-authored-by: Chris Mills <[email protected]>
mdn · Dec 19, 2024 · 8013290 · 8013290
1 parent 5b20f5f
commit 8013290
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/files/en-us/web/css/css_fonts/variable_fonts_guide/index.md b/files/en-us/web/css/css_fonts/variable_fonts_guide/index.md
@@ -661,11 +661,12 @@ The basic syntax is the same, but the font technology can be specified, and allo
     format("woff2-variations");
   font-weight: 125 950;
   font-stretch: 75% 125%;
+
   font-style: normal;
 }
 ```
 
-In this case, the `normal` value indicates that this font file should be used when in a style rule the `font-family` property is `MyVariableFontName` and the [font-style](/en-US/docs/Web/CSS/font-style) property is `normal`. The `oblique 0deg` and `oblique 0deg 20deg` values, because of the `0deg`, also indicate the font has normal upright glyphs.
+In this case, the `font-style: normal` declaration indicates that this font file should be used when `font-family` is set to `MyVariableFontName` and [`font-style`](/en-US/docs/Web/CSS/font-style) is set to `normal`. As an alternative, you could use `font-style: oblique 0deg` or `font-style: oblique 0deg 20deg` to indicate that the font has normal upright glyphs (indicated by `0deg`).
 
 #### Example for a font that contains only italics and no upright characters
 
@@ -676,11 +677,12 @@ In this case, the `normal` value indicates that this font file should be used wh
     format("woff2-variations");
   font-weight: 125 950;
   font-stretch: 75% 125%;
+
   font-style: italic;
 }
 ```
 
-In this case, the `italic` value indicates that this font file should be used when in a style rule the `font-family` property is `MyVariableFontName` and the [font-style](/en-US/docs/Web/CSS/font-style) property is `italic`. The `oblique 14deg` value also indicates the font has italic glyphs.
+In this case, the `font-style: italic` declaration indicates that this font file should be used when `font-family` is set to `MyVariableFontName` and [`font-style`](/en-US/docs/Web/CSS/font-style) is set to `italic`. As an alternative, you could use `font-style: oblique 14deg` to indicate that the font has italic glyphs.
 
 #### Example for a font that contains an oblique (slant) axis
 
@@ -691,6 +693,7 @@ In this case, the `italic` value indicates that this font file should be used wh
     format("woff2-variations");
   font-weight: 125 950;
   font-stretch: 75% 125%;
+
   font-style: oblique 0deg 12deg;
 }
 ```