Im saving some images from my illustrator file as SVGs to use as background images for a website. I know you can set the image size in px but does it have any inherent px size set in the file?
2 Answers
Yes.
When you save an SVG from Illustrator, resize everything, save another SVG and output both of those in HTML, they will be shown in different sizes, depending on how big you saved them.
Setting these values should be easy enough in the artboard, but I always just set a css-property (obviously only works on the web)
Open up your SVG file in a text editor and see for yourself!
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="60px" height="60px" viewBox="0 0 60 60" enable-background="new 0 0 60 60" xml:space="preserve">
<line fill="none" stroke="#FFFFFF" stroke-width="12" x1="1.1" y1="1.2" x2="58.8" y2="58.8"/>
</svg>
Relevant properties can be found in the SVG tag:
- width and height
- viewBox
- enable-background (not super relevant for the Web but worth noting I guess)