Skip to content

Commit da8c317

Browse files
authored
chore: small improvements to SVG examples (mdn#40406)
1 parent 52d8403 commit da8c317

File tree

6 files changed

+26
-62
lines changed

6 files changed

+26
-62
lines changed

files/en-us/web/svg/reference/attribute/font-family/index.md

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,9 @@ You can use this attribute with the following SVG elements:
1717
- {{SVGElement("textPath")}}
1818
- {{SVGElement("tspan")}}
1919

20-
## Example
21-
22-
```css hidden
23-
html,
24-
body,
25-
svg {
26-
height: 100%;
27-
}
28-
```
20+
## Examples
21+
22+
### Controlling SVG font family
2923

3024
```html
3125
<svg viewBox="0 0 200 30" xmlns="http://www.w3.org/2000/svg">
@@ -34,7 +28,7 @@ svg {
3428
</svg>
3529
```
3630

37-
{{EmbedLiveSample("Example", "200", "30")}}
31+
{{EmbedLiveSample}}
3832

3933
## Usage notes
4034

files/en-us/web/svg/reference/attribute/font-size/index.md

Lines changed: 6 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -17,24 +17,18 @@ You can use this attribute with the following SVG elements:
1717
- {{SVGElement("textPath")}}
1818
- {{SVGElement("tspan")}}
1919

20-
## Example
21-
22-
```css hidden
23-
html,
24-
body,
25-
svg {
26-
height: 100%;
27-
}
28-
```
20+
## Examples
21+
22+
### Controlling SVG font size
2923

3024
```html
3125
<svg viewBox="0 0 200 30" xmlns="http://www.w3.org/2000/svg">
32-
<text y="20" font-size="smaller">smaller</text>
33-
<text x="100" y="20" font-size="2em">2em</text>
26+
<text y="25" font-size="smaller">smaller</text>
27+
<text x="100" y="25" font-size="2em">2em</text>
3428
</svg>
3529
```
3630

37-
{{EmbedLiveSample("Example", "200", "30")}}
31+
{{EmbedLiveSample}}
3832

3933
## Usage notes
4034

files/en-us/web/svg/reference/attribute/font-style/index.md

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,9 @@ You can use this attribute with the following SVG elements:
1717
- {{SVGElement("textPath")}}
1818
- {{SVGElement("tspan")}}
1919

20-
## Example
21-
22-
```css hidden
23-
html,
24-
body,
25-
svg {
26-
height: 100%;
27-
}
28-
```
20+
## Examples
21+
22+
### Controlling SVG font style
2923

3024
```html
3125
<svg viewBox="0 0 250 30" xmlns="http://www.w3.org/2000/svg">
@@ -34,7 +28,7 @@ svg {
3428
</svg>
3529
```
3630

37-
{{EmbedLiveSample("Example", "250", "30")}}
31+
{{EmbedLiveSample}}
3832

3933
## Usage notes
4034

files/en-us/web/svg/reference/attribute/font-variant/index.md

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,9 @@ You can use this attribute with the following SVG elements:
1717
- {{SVGElement("textPath")}}
1818
- {{SVGElement("tspan")}}
1919

20-
## Example
21-
22-
```css hidden
23-
html,
24-
body,
25-
svg {
26-
height: 100%;
27-
}
28-
```
20+
## Examples
21+
22+
### Controlling SVG font variations
2923

3024
```html
3125
<svg viewBox="0 0 250 30" xmlns="http://www.w3.org/2000/svg">
@@ -34,7 +28,7 @@ svg {
3428
</svg>
3529
```
3630

37-
{{EmbedLiveSample("Example", "250", "30")}}
31+
{{EmbedLiveSample}}
3832

3933
## Usage notes
4034

files/en-us/web/svg/reference/attribute/font-weight/index.md

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,9 @@ You can use this attribute with the following SVG elements:
1717
- {{SVGElement("textPath")}}
1818
- {{SVGElement("tspan")}}
1919

20-
## Example
21-
22-
```css hidden
23-
html,
24-
body,
25-
svg {
26-
height: 100%;
27-
}
28-
```
20+
## Examples
21+
22+
### Controlling SVG font weight
2923

3024
```html
3125
<svg viewBox="0 0 200 30" xmlns="http://www.w3.org/2000/svg">
@@ -34,7 +28,7 @@ svg {
3428
</svg>
3529
```
3630

37-
{{EmbedLiveSample("Example", "200", "30")}}
31+
{{EmbedLiveSample}}
3832

3933
## Usage notes
4034

files/en-us/web/svg/reference/attribute/letter-spacing/index.md

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ The **`letter-spacing`** attribute controls spacing between text characters.
1010

1111
If the attribute value is a unitless number (like `128`), the browser processes it as a {{cssxref("length")}} in the current user coordinate system.
1212

13-
If the attribute value has a unit identifier, such as `.25em` or `1%`, then the browser converts the \<length> into its corresponding value in the current user coordinate system.
13+
If the attribute value has a unit identifier, such as `.25em` or `1%`, then the browser converts the `<length>` into its corresponding value in the current user coordinate system.
1414

1515
> [!NOTE]
1616
> As a presentation attribute, `letter-spacing` also has a CSS property counterpart: {{cssxref("letter-spacing")}}. When both are specified, the CSS property takes priority.
@@ -21,15 +21,9 @@ You can use this attribute with the following SVG elements:
2121
- {{SVGElement("textPath")}}
2222
- {{SVGElement("tspan")}}
2323

24-
## Example
24+
## Examples
2525

26-
```css hidden
27-
html,
28-
body,
29-
svg {
30-
height: 100%;
31-
}
32-
```
26+
### Controlling SVG letter spacing
3327

3428
```html
3529
<svg viewBox="0 0 400 30" xmlns="http://www.w3.org/2000/svg">
@@ -38,7 +32,7 @@ svg {
3832
</svg>
3933
```
4034

41-
{{EmbedLiveSample("Example", "200", "30")}}
35+
{{EmbedLiveSample}}
4236

4337
## Usage notes
4438

0 commit comments

Comments
 (0)