Image Tag in HTML?
- In HTML we use <img> tag to add images on our webpage.
- The <img> tag doesn't require any closing tag.
Image Tag Attributes
- src: It is used to specify the path of the image.
- alt: If users are unable to see an image then they will see the alt value.
- style: This attribute is used to add style to the image like width, height, etc.
- width: It is used to specify the width of the image.
- height: It is used to specify the height of the image.
- title: This attribute is used to set the title on the image.
<img width="200px" src="https://cdn.pixabay.com/photo/2015/09/05/20/02/coding-924920_1280.jpg" alt="coding image">
- src: It is used to specify the path of the image.
- alt: If users are unable to see an image then they will see the alt value.
- style: This attribute is used to add style to the image like width, height, etc.
- width: It is used to specify the width of the image.
- height: It is used to specify the height of the image.
- title: This attribute is used to set the title on the image.
<img width="200px" src="https://cdn.pixabay.com/photo/2015/09/05/20/02/coding-924920_1280.jpg" alt="coding image">
Anchor Tag in HTML
- In HTML <a> tag is used to create hyperlinks on the web page.
- It contains the content between the opening and closing tags which will be hyper content.
Anchor Tag Attributes
- href: It is used to set the URL.
- target: This will specify where the linked content will be opened.
- _blank: It will open the link in a new tab.
- _self: It will open the link in a current browser tab.
- _top: This works the same as _self.
Let's do some cool things with Anchor Tag
i). Link to an email address:
<a href="mailto:contact.geekshelp.@gmail..com">Send email</a>
ii). Link to a phone number:
<a href="tel:+91123456789">123456789</a>
iii). Go to a section on the webpage:
<a href="#section">Go to Section</a>
Code Described in the video
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Links and Images in HTML </title>
</head>
<body>
<!-- Image in HTML -->
<img width="200px" src="https://cdn.pixabay.com/photo/2015/09/05/20/02/coding-924920_1280.jpg" alt="coding image">
<!-- Links in HTML -->
<a href="https://google.com" target="_blank"> Go to Google </a>
<a href="mailto:contact.geekshelp@gmail.com"> Mail to Geeks Help </a>
<a href="tel:+917357300000"> Call To </a>
</body>
</html>
