Image and Links in HTML

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="" 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="">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">

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> Links and Images in HTML </title>

    <!-- Image in HTML -->
    <img width="200px" src="" alt="coding image">

    <!-- Links in HTML -->
    <a href="" target="_blank"> Go to Google </a>

    <a href=""> Mail to Geeks Help </a>
    <a href="tel:+917357300000"> Call To </a>


Post a Comment

* Please Don't Spam Here. All the Comments are Reviewed by Admin.

Top Post Ad

Below Post Ad

Ads Section