Learn D3.js

SVG styling with CSS

You can also specify style rules using SVG CSS properties, which have the same names as the attributes. CSS properties, however, have precedence over XML attributes. Declaring a style with the same name as an attribute will override it. If you add the following style declaration in the <style> block of your page, the width of all lines will change to 20 pixels:

line {    stroke-width: 20px; /* Overrides attr */}

This result is shown below. The lines at the edges seem thinner because half of their width is outside the context:

Overriding XML style attributes with CSS. Code: SVG/4-lines-css.html.

You can also apply CSS class ...