Need idea about HTML5 Syntax
i have just created a page using HTML5 but image is showing too small.
How can i adjust image size using HTML5?
<img src="myimage.jpg" width="100" height="60" alt="My picture"/>
width and height 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.
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.
Last edited by deathshadow; 05-29-2014 at 11:41 AM.
i think you must go to youtube and see the html5 image tutorial to learn this process.
Just resizing the image width and size.
<img src="url" style="width:100%; height:50%;" alt="image name">
if you want resizing the image width and height.
Assuming the image is actually a mathematical or scientific figure (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) and that the STYLE attribute has any business being used on a IMG tag.
Originally Posted by Veeramanikandan
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:
<img class="reduced" src="path/name.jpg" alt="<!-- what the image shows -->">
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:
and ALL the images you have scaled with class="reduced" automatically adjust!
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.
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)