O'Reilly logo

SVG Essentials by J. David Eisenberg

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

Using CSS with SVG

The question then becomes: which attributes in SVG elements can also be specified in a stylesheet? Table B-1 is a list of the properties you may use in a stylesheet, the valid values (with default value shown in boldface where appropriate), and the elements to which they may be applied. It is a modified version of the property index from the SVG specification at http://www.w3.org/TR/SVG/.[26]

Table B-1. CSS property table for SVG

Name

Values

Applies to

alignment-baseline

auto | baseline | before-edge | text-before-edge | middle | after-edge | text-after-edge | ideographic | alphabetic | hanging | mathematical

<tspan>, <tref>, <altGlyph>, <textPath>

baseline-shift

baseline | sub | super | percentage | length

<tspan>, <tref>, <altGlyph>, <textPath> elements

clip

shape | auto

Elements which establish a new viewport, <pattern> elements and <marker> elements

clip-path

uri

Container elements and graphics elements

clip-rule

nonzero | evenodd | class=noxref

Graphics elements within a <clipPath> element

color

color

Elements to which properties fill, stroke, stop-color, flood-color, lighting-color apply

color-interpolation

auto | sRGB | linearRGB

Container elements, graphics elements and <animateColor>

color-interpolation-filters

auto | sRGB | linearRGB

Filter primitives

color-profile

auto | sRGB | name | uri

<image> elements that refer to raster images

color-rendering

auto | optimizeSpeed | optimizeQuality

Container elements, graphics elements ...

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