This rectangle is affected by the presentation attributes
<svg>
<rect width="200" height="200" fill="slategrey" stroke="black" stroke-width="3"/>
</svg>
This rectangle is affected by the inline styles
<svg>
<rect x="203" width="200" height="200" style="fill:slategrey; stroke:black; stroke-width:3; -webkit-transform: rotate(45deg);"/>
</svg>
This rectangle is affected by the internal styles; Hover over it.
<svg>
<rect width="200" height="200"/>
</svg>
The elements below are affected by the styles on <g> element.
<svg>
<g style="fill:slategrey; stroke:black; stroke-width:3; fill-opacity: 0.5;">
<rect x="203" width="200" height="200"/>
<circle cx="120" cy="106" r="100"/>
</g>
</svg>
