HTML <img> src Attribute

Last Updated : 12 Jan, 2024

The <img> src attribute is used to specify the URL of the source image. It points to the location of the image file that the browser should display on the webpage.

Syntax:

<img src="URL">

Attribute Values:

It contains a single-value URL that specifies the link to the source image. There are two types of URL links which are listed below:

Attribute Values	Description
Absolute URL	It points to another webpage.
Relative URL	It points to other files on the same web page.

Example: This example illustrates the use of the image src attribute with an HTML document.

html

<!DOCTYPE html>
<html>

<head>
    <title>
        img src Attribute
    </title>
</head>

<body>
    <h1>GeeksforGeeks</h1>
    <h2>HTML <img> src Attribute</h2>
    <img src=
"https://media.geeksforgeeks.org/wp-content/uploads/20190506164011/logo3.png" 
         alt="GeeksforGeeks logo">
</body>

</html>

Output:

Related DOM Property:

HTML DOM Image src Property

Supported Browsers:

Google Chrome 1
Edge 12
Firefox 1
Safari 15
Opera 1

J

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.