How to set image size in html

There are two ways to set the image size in HTML: use the width and height attributes to directly specify the image size. Use the CSS style property to specify more complex styles, including image dimensions.

How to set the image size in HTML

There are two ways to set the image size in HTML: Use width and height properties, or use the CSS style property.

Using the width and height properties

width and height The attributes directly specify the width and height of the image. They are the simplest way to set the size of an image in HTML.

<code class="html"><img src="image.jpg" width="200" height="100"></code>

In this case, the image will be 200 pixels wide and 100 pixels tall.

Using CSS style Properties

CSS style properties allow you to specify image size as well as other style properties.

<code class="html"><img src="image.jpg" style="width:200px;height:100px;"></code>

In this case the image will also be 200 pixels wide and 100 pixels tall.

Notes on setting the image size

• The width and height units can be pixels (px), percentage (%) or other CSS unit.
• If no unit is specified, the default unit is pixels.
• If only one dimension is specified, the other dimension will automatically adjust to maintain the aspect ratio.
• You can use the CSS max-width and max-height properties to limit the maximum size of the image.

The above is the detailed content of How to set image size in html. For more information, please follow other related articles on the PHP Chinese website!