The width and height attributes, regardless if done as HTML attributes, or as CSS style attributes, are valid in the latest HTML5 standard. However, it's highly recommended to use the CSS styling because it prevents internal or external stylesheets from changing the original size of an image:
| HTML file: | Displayed by browser: |
|---|---|
|
<!DOCTYPE html>
<html> <head> <style> img { width:100%; } </style> </head> <body> <p>This is done with the style attribute:</p> <img src="images/html5.gif" alt="HTML5 Icon" style="width:128px;height:128px;"> <p>This is done with the width & height attribute:</p> <img src="images/html5.gif" width="128" height="128" alt="HTML5 Icon"> </body> </html> |
This is done with the style attribute: 
This is done with the width & height attribute:
|
If the internal or external CSS stylesheet specifies "100%" for images, the browser will display images to 100% of the webpage's full width. We've all seen webpages with distorted images!
