• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Chapter 4. Using CSS with SVG > What Is Styling in SVG?

What Is Styling in SVG?

SVG provides us with many techniques to alter the visual appearance of any arbitrary graphic shape. We can, for example, make a solid line or a dashed line, a thin line or a thick line, a black line or any other color of line, a fully opaque line or a semi-transparent line. We can specify that a shape has no fill or has a fill of a particular color. We can specify the size of a font to be used to display text; its color; whether it is normal, bold, or italic; and so on. All these presentation aspects of an SVG object can be defined using one or more of the techniques that SVG provides for the developer to have precise control of styling.

Styling in SVG is founded on the Cascading Style Sheets specifications, which are also produced by the W3C. Just as there are several ways to apply CSS styles to HTML elements, so SVG provides more than one way to apply styles to an SVG image. If you know how to use CSS with HTML or XHTML, parts of this chapter will seem familiar. The needs of the individual designer who wants to tweak the appearance of a single element are supported. Equally, at the other end of the spectrum, the needs to control site-wide corporate styles using external CSS style sheets are also supported in SVG.


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint