Can SVG be Directly Embedded within CSS?

Embedding Inline SVG in CSS

Can you directly embed an SVG definition within CSS? For instance, can you use something like this:

.my-class {
  background-image: <svg>...</svg>;
}

Answer

Yes, you can do that. Here's an example:

body {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10'><linearGradient>

The above is the detailed content of Can SVG be Directly Embedded within CSS?. For more information, please follow other related articles on the PHP Chinese website!