HTML <img> width Attribute

Last Updated : 12 Mar, 2024

Width attribute in HTML <img> tags specifies the width of the image element in pixels or as a percentage of its containing element's width, controlling its visual size on the webpage.

Syntax:

<img width="pixels">

Attribute Values: They contain single value pixels which specify the width of the image in pixels.

HTML <img> Width Attribute Examples:

Example: In this example, we display the GeeksforGeeks logo using the <img> tag with the width attribute set to 200px, adjusting the image's width on the webpage.

HTML

<!DOCTYPE html>
<html>

<head>
    <title>
        HTML img width Attribute
    </title>
</head>

<body>
    <img src=
"https://media.geeksforgeeks.org/wp-content/uploads/20190506164011/logo3.png" 
         alt="GeeksforGeeks logo"
         width="200px" 
         height="200px">
</body>

</html>

Output:

html-image-width-attribute-example — HTML image width attribute example

Supported Browsers:

The browser supported by HTML <img> width attribute are listed below:

jit_t

Improve

Article Tags :

Similar Reads

HTML <img> align Attribute

The HTML <img> align attribute sets an imageâ€™s alignment relative to surrounding elements, allowing horizontal or vertical positioning. It is deprecated in HTML5 and replaced by CSS properties like float and vertical alignment for more flexible and modern alignment options.Note: The align attr

HTML img alt Attribute

The <img> alt attribute is used to specify alternative text for an image. This attribute is particularly useful when the image cannot be displayed, either due to a broken link or when users rely on screen readers.Syntax<img src="image.jpg" alt="text">Attribute ValuesThe alt attribute con

HTML | <img> border Attribute

The <img> border attribute is used to specify the border width around the image. The default value of <img> border attribute is 0. It is not supported by HTML 5. Use CSS instead of this attribute. Syntax: <img border="pixels"> Attribute Values: It contains single value pixels which

HTML <img> crossorigin Attribute

The HTML crossorigin Attribute in is used in <img> element that supports a CORS request when we tried to fetch out the .png or .jpg files from the third party server or from other domain.Â Syntax <img crossorigin="anonymous | use-credentials"> Attribute Values: anonymous: It has a defaul

HTML | <img> height Attribute

The <img> height attribute is used to specify the height of the image in pixels. Syntax: <img height="pixels"> Attribute Values: It contains single value pixels which specify the height of the image in pixel. Example: html <!DOCTYPE html> <html> <head> <title> HTM

HTML | <img> hspace Attribute

The HTML <img> hspace attribute is used to specify the number of whitespaces on the left and the right side of the image. The hspace attribute is not supported by HTML 5 you can use CSS there. Syntax: <img hspace="pixels"> Attribute Values: pixels: It specifies the number of whitespaces

HTML | <img> ismap Attribute

The HTML <img> ismap Attribute is a Boolean attribute. When exist, it specifies that the image is a component element of a server-side image-map (an image-map is a picture with clickable areas). When clicking on a server-side image-map, the press coordinates square measure sent to the server a

HTML <img> loading Attribute

In this article, we will discuss the HTML img loading attribute. This attribute handles how an image will be loaded on a webpage. It accepts three string values, namely, auto, eager and lazy.Lazy Loading Attribute: This strategy is used to identify resources as non-critical and the resources will be

HTML <img> longdesc Attribute

In this article, we will discuss longdesc in HTML. Longdesc is an HTML attribute used to provide a detailed description of an image. It is an optional attribute that can be used to add extra details about an image beyond the shorter description provided as a tooltip. Syntax: <img longdesc="string

HTML <img> referrerpolicy Attribute

The HTML <img> referrerpolicy attribute is used to specify the reference information that will be sent to the server when fetching the image. Syntax: <img referrerpolicy="value"> Attribute Values : no-referrer: It specifies that no reference information will be sent along with a request.