Which of the following attribute should be used with IMG tag to get the location of the image that has to be displayed in a Web page?

That’s why it’s important to understand how the image element and source attribute work in HTML. It can come in handy when you’re building a site from scratch, customizing a pre-designed template, or tinkering around in the source code of a web page in your CMS.

Let’s take a closer look at this pair below.

While the HTML image element is used to embed an image in an HTML doc, it doesn’t technically insert the image into the web page. In fact, the image element doesn’t technically do anything on its own. It really just creates a space for the reference to an image.

That reference is found in the source attribute. The source attribute contains the path to the image file or its URL. That explains why images are technically linked to — not embedded — in web pages.

Take a look at the example below.

See the Pen Image elements with and without src attribute by Christina Perricone (@hubspot) on CodePen.

In this example, you can see in the HTML that the first image element has a source attribute that contains a link to Pixabay. The second image element has no source attribute.

The width and height properties are specified in CSS. This is considered a best practice because, if the width and height are not specified, the page might flicker while the image loads.

In the result tab, the first image appears and is 300px by 200px. The second image, however, renders as an empty box with a 300px by 200px outline. That’s because the browser didn’t know what image to render without the source attribute.

Let’s take a closer look at the syntax of the image element and source attribute below.

HTML Img Syntax

The syntax of the image element is:

The img element is known as an “empty element” because it starts with an

The source attribute is required since it contains the path to the image file or its URL. This will be placed between the apostrophes. Without the source attribute defined, the browser won’t be able to find and render the image.

Remember that images are not actually embedded into web pages. That means, when a web page loads, the browser has to retrieve the image from a web server and display it on the page. The broken link icon means that the browser could not find the image.

If you’ve just added the image, then check that you included the correct image URL in the source attribute. Any misspelling or missing letters or punctuation could result in the broken link icon. In the example below, I left off the closing apostrophe of the src attribute, which results in the broken link icon on the front end. 

See the Pen Img src by Christina Perricone (@hubspot) on CodePen.

If you previously added the image to your site and recently noticed it’s displaying the broken link icon, then that means the URL specified in the source attribute is no longer correct. Maybe the image has been removed from the web page you cited, or was moved into a different folder on your site so the file path is no longer correct. You'll have to track down the new image URL, or replace it, to resolve the issue.

The Required Attribute of the HTML Img Element

The img src attribute is a fundamental concept of coding. Every image element requires a valid source attribute so that the browser can locate and display the correct image. Now that you understand this concept, you’re already on the path to learning HTML and CSS.

Which of the following attributes should I use with IMG tag to get the location of the image that has to be pointed in a web page 1 point a width B href C src D alt?

Which attribute specifies the location of the image to be included in a web page?

What are the attributes used with IMG tag?

Which of the following attributes can be used to define the location of an image?