Sams Teach Yourself SVG in 24 Hours

Grouping Styles

Applying style to a grouping of objects, rather than individual elements, is also very effective for reducing the number of applications of the class attribute in your files. Similar to how most design programs handle groupings, SVG allows developers the ability to associate elements together using the g element.

The group element itself generally does not affect the display of its enclosed content. However, when a style or transformation (you'll learn about this in Hour 14, “Transforms”) is applied to the group, the enclosed content is affected according to such an application. In the case of the raindrops, if you want every raindrop to appear the same, you can apply one class to a group surrounding all three objects by moving ...