[B]width [/B]and [B]height [/B]are in pixels. If you go larger than the original image size you may not like the results. For example, if the original image is 30x30 but you want 45x45, the image will probably be pretty fuzzy if you use width and height to try and "enlarge" it.
@deathshadowMay 29.2014 — #What image? What site? No code, no site, we can't really help you!
Though adjusting an image's size through the browser is usually -- as kevin2 mentioned -- rubbish. NOT that sizing something is HTML 5's job -- or that images in HTML 5 behave any differently than they did 15 years ago in HTML 3.2 -- so mentioning it's HTML 5 is kinda pointless.
ALMOST sounds like you mean to be asking about CSS, which is for saying what things look like. HTML is just to say what things ARE.
</figure> [/QUOTE] Assuming the image is actually a mathematical or scientific figure [i](which it probably isn't, which is why HTML 5 garbage like FIGURE and ASIDE are about as useful as ADDRESS and semantic as CENTER)[/i] and that the STYLE attribute has any business being used on a IMG tag.
@jedaisoulMay 30.2014 — #Back in the pre-broadband days, it was useful to set the width (and/or height) of an image in the HTML because that reserved the space for it whilst the image loaded. Otherwise the layout shuffled about during page load. Nowadays, that isn't so much of problem, and you should generally use the CSS settings (see below). However, please note:
1. Using the CSS settings to make images LARGER is often a bad idea, because the images quickly become fuzzy and look unprofessional.
2. Using the CSS settings to make images SMALLER can waste bandwidth, unless it avoids downloading multiple copies of an image in different sizes. So that is less clear-cut.
3. If you DO use the width or height setting on an image, you should generally only set one or the other. That way the system automatically scales the other dimension to preserve the aspect ratio. E.g. say you have a 300px by 150px image that you want to display 2/3 size, you can set:
HTML code:
<img class="reduced" src="path/name.jpg" alt="<!-- what the image shows -->">
CSS code:
.reduced {
width:200px;
}
The image is displayed 200px by 100px. Note: Setting the display size in the CSS has the advantage that if there are multiple images you have scaled and you decide to change the scaling to 240px, you just amend the CSS to:
.reduced {
width:240px;
}
and ALL the images you have scaled with class="reduced" automatically adjust!
@Seasia1authorJun 03.2014 — #Well, i tried this code and it really works and i am now able to fix the size in the form of % but on the other hand which kevin mention - <img src="myimage.jpg" width="100" height="60" alt="My picture"/> it gives an error at my end.