O'Reilly logo

CSS Master by Tiffany B Brown

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

Chapter 8 Using CSS with SVG

So far we've talked about using CSS with HTML, but we can also use CSS with SVG, or Scalable Vector Graphics. With CSS, we can change the appearance of SVG based on user interaction. We can use the same SVG document in multiple places, showing or hiding portions of it based on the width of the viewport.

Before we go any further, however, let's talk about what SVG is and why you should use it.

Vector Images versus Raster Images

Most of the images currently used on the Web are raster images, also known as bitmap images. Raster images are made up of pixels on a fixed grid, with a set number of pixels per inch. JPEG, WebP, GIF, and PNG are all examples of raster image formats.

Raster images are resolution ...

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