Is it possible to style external svg file with css without modifying the svg file content?
<img src="image/svg/3ds-max.svg">
And is there any better way to display external svg file in html5?
It's not possible using an img tag, these are basically similar to bitmaps as far as accessing or modify them is concerned. You could use the <iframe>
tag with its style attribute instead or alternatively just include the svg inline in the file which you can do with html5.
Almost. If you can embed your SVG directly in your HTML5 document using the svg
tag, then you can style it with CSS, like so:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style type="text/css">
#redcircle { stroke:black; stroke-width:5; }
</style>
</head>
<body>
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
<circle id="redcircle" cx="50" cy="50" r="30" fill="red" />
</svg>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With