HTML Attributes 📌


In this lecture, we are going to talk about some HTML attribute.


HTML Attributes

Let's talk about herf tage

The <a> tag defines a hyperlink. The href attribute specifies the URL of the page the link goes to:


<a href="https://www.html.org.in">Go to HTML.ORG.IN</a>
                

Let's talk about Download file when clicking on the link (instead of navigating to the file) tage

The download inside the a tag specifies that the target (the file specified in the href attribute) will be downloaded when a user clicks on the hyperlink.

    
    <a href="file.pdf" download>
    <img src="download_logo.jpg" alt="W3Schools" width="100" height="100">
    </a>

Let's talk about src tage

The <img> tag defines an image. The src attribute specifies the URL of the image:


<img src="https://www.html.org.in/img-1.png">
                

There are two ways to specify the URL in the src attribute

1. Absolute URL: https://www.html.org.in/img-1.png
Now question is, how do we know that the URL is absolute?
Absolute URL is a URL that starts with http:// or https://, Links to an external image that is hosted on another website.

Note:- Maybe you don't own the copyright of the image & Then if you use this image, you may be violated copyright law.



2. Relative URL: ./html-img/a
Now question is, What is relative URL?
Relative URL is a URL that starts with ./ or ../, Links to an image that is hosted on the same website.

Tip:- If you ask me I'll recommend you to use a relative URL. Because in the future you may want to move your website to another domain, Then your website will never break.

Let's talk about alt tage

The <img> tag defines an image. The alt attribute specifies an alternate text for the image, if the image cannot be displayed:


<img src="https://www.html.org.in/img-1.png" alt="HTML.ORG.IN">
                

Note:- The alt attribute is used to specify an alternate text for an image, if the image cannot be displayed.

Let's talk about title tage

The <img> tag defines an image. The title attribute specifies extra information about the image:


<img src="https://www.html.org.in/img-1.png" alt="HTML.ORG.IN" title="HTML.ORG.IN">
                

Note:- The title attribute is used to specify extra information about an image.

Let's talk about width tage

The <img> tag defines an image. The width attribute specifies the width of the image:


<img src="https://www.html.org.in/img-1.png" alt="HTML.ORG.IN" title="HTML.ORG.IN" width="100">
                

Let's talk about height tage

The <img> tag defines an image. The height attribute specifies the height of the image:


<img src="https://www.html.org.in/img-1.png" alt="HTML.ORG.IN" title="HTML.ORG.IN" width="100" height="100">