O'Reilly logo

Sams Teach Yourself SVG in 24 Hours by Micah Laaker

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

Creating a Style Sheet

With an understanding of what a style sheet is fresh in your memory, you can actually begin the process of making one for your SVG content. You can start by creating an internal CSS style sheet.

To make sense of all this style information, you can modify the raindrop example from last hour, shown in Figure 6.1. Using Listing 5.10 as a foundation, you'll need to insert a style element into your new document (line 6 in Listing 6.1). Within this element, you will need to insert a CDATA section (line 7), which alerts the SVG viewer not to parse its contents.

Figure 6.1. An internal style sheet can provide the information to paint this raindrop.

Now it's time to create a rule. First take the two style declarations used to create ...

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