Open In App

HTML src attribute

Improve
Improve
Like Article
Like
Save
Share
Report

The HTML src attribute specifies the URL or file path of an external resource, such as an image, video, audio file, or script, to be embedded or referenced within a webpage.

Syntax:

<element  src="url">

HTML src attribute Supported tags

TagDescription
<audio>Embeds sound content for playback in a webpage.
<embed>Integrates external applications or content.
<iframe>Embeds another HTML document within the current one.
<frame>Deprecated. Divides the browser window.
<img>Embed images for display.
<input>Creates interactive control elements in forms.
<script>Embeds or links to external scripts.
<source>Specifies alternative media resources.
<track>Provides text tracks for multimedia elements.
<video>Embeds video content for playback in a webpage.

Attribute Values

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

TermDescription
Absolute URLPoints to a resource outside the current website/domain.
Relative URLPoints to a resource within the same website/domain.

Example of HTML src attribute

Example 1: In this example we displays GeeksforGeeks heading and an audio player with multiple source files for playback control.

html
<!DOCTYPE html> 
<html> 
<head> 
    <title> 
        HTML audio src Attribute 
    </title> 
</head> 

<body style="text-align:center;"> 
    
    <h1 style="color:green">
          GeeksforGeeks
      </h1> 
    
    <h2> 
        HTML audio src Attribute 
    </h2> 
    
    <audio controls muted> 
        <source src="GFG.mp3" type="audio/mp3"> 
        <source src="GFG.ogg" type="audio/ogg"> 
    </audio> 
</body> 
</html>                     

Output:  

Example 2: In this example image linked via the “src” attribute with an alternative text.

html
<!DOCTYPE html> 
<html> 

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

<body> 
    <h1 style="color:green">
          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:  


Supported Browsers: The browsers supported by HTML src attribute are listed below: 


Last Updated : 27 Mar, 2024
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads