O'Reilly logo

Designing SVG Web Graphics by Andrew H. Watt

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Text in SVG

Text to be displayed in SVG is held as character data. All text is contained within <text> elements, but can be further nested within <tspan> elements.

When text is displayed, the font defined in the style attribute of the <text> or <tspan> element or in an external CSS style sheet is associated with font tables that define how individual characters are to be displayed in that font. The font tables associate a character with its visual representation—a glyph.

Listing 4.1 illustrates the difference between a glyph and a character. Each of the five glyphs shown in Figure 04.01 represents the uppercase version of a character—in this case, the first letter in the English alphabet, the letter A. Yet each glyph has a different appearance. ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required