Open In App

What is significance of declaring attribute in HTML elements ?

Last Updated : 02 Feb, 2022
Improve
Improve
Like Article
Like
Save
Share
Report

In this article, we will know HTML Attributes’ significance while declaring and their implementation through the examples. All HTML elements have attributes that will provide additional information about that particular element. It takes 2 parameters, ie, a name & a value which define the properties of the element and are placed inside the element tag.

The name parameter takes the name of the property we would like to assign to the element and the value takes the properties value or extent of the property names that can be aligned over the element. Every name has some value that must be written within quotes.

Syntax:

<element attribute_name="attribute_value">

HTML src Attribute: If we want to insert an image into a webpage, then we need to use the <img> tag and the src attribute. We will need to specify the address of the image as the attribute’s value inside the double quote.

Example: This example explains the HTML src Attributes to specify the source address of the file.

HTML




<html>
  
<head>
    <title>src Attribute</title>
</head>
  
<body>
    <img src=
</body>
  
</html>


Output:

HTML alt Attribute: This is an alternate tag that is used to show or display something if the primary attribute i.e., the <img> tag, fails to display the value assigned to it. This can also be used to describe the image to a developer who is actually sitting at the coding end.

Example: This example explains the HTML alt Attributes to specify the name of the file when the image is not loaded properly.

HTML




<html>
  
<head>
    <title>alt Attribute</title>
</head>
  
<body>
  
    <!--If the image is not found or the img field
    is left blank the alt value gets displayed-->
    <img src
         alt="The Logo"><br>
    <img src="" alt="Since the src value is blank, the alt value is displayed">
</body>
  
</html>


Output:

HTML width and height Attribute: This attribute is used to adjust the width and height of an image.

Example: This example explains the HTML width & height Attributes to specify the different sizes of the images.

HTML




<html>
  
<head>
    <title>Width and Height</title>
</head>
  
<body>
    <img src=
         width="300px" height="100px">
</body>
  
</html>


Output:



Similar Reads

What’s the difference between “Array()” and “[]” while declaring a JavaScript array?
Consider the below codes: var myArray = new Array(5); and var myArray = [5]; Though these two lines might appear the same, but it is not the case. Consider the below explanations: Case 1: var myArray = new Array(5) This method is used to define an array of length 5. The parameter passed here '5' is an argument that defines the initial length of the
2 min read
What happen when we directly assign the variable without declaring it in JavaScript ?
JavaScript has two scopes which are the local scope and global scope and when we directly assign a variable without declaring, it becomes a global property of the window object. The window is the object of the browser. It is not the object of JavaScript. It is automatically created by the browser and it can be accessed from anywhere on the web page
2 min read
TypeScript Declaring this in a Function
TypeScript Declaring this in a Function, where 'this' in TypeScript refers to an object's current instance in a function, granting access to its properties and methods. It's essential to declare 'this' types for safety while using functions in TypeScript and properly declare the type of 'this'. Syntax:const myFunction = (param1: number, param2: str
2 min read
How to Declare Object Value Type Without Declaring Key Type in TypeScript ?
We will create an object value type without declaring the key type. We can not directly define the type of value we will use different methods for declaring the object value type. These are the following methods for declaring the object value type: Table of Content Using Record Utility TypeUsing Mapped TypesUsing GenericsBy utilizing Indexed TypesA
3 min read
What is the Syntax for Declaring Functions in JavaScript ?
Generally, in JavaScript, the function keyword is used to declare a variable. But, there are some more ways available in JavaScript that can be used to declare functions as explained below: Using function keyword: This is the most common way to declare functions in JavaScript by using the function keyword before the name of the function.Declaring a
1 min read
What is the significance of adding autocomplete attribute in HTML Form ?
The HTML &lt;form&gt; autocomplete attribute is used to specify that the form has autocompleted on or off value. When the autocomplete attribute is set to "on", the browser will automatically complete the values based on which the user entered before. Syntax: &lt;form autocomplete="on|off"&gt; Attribute values: on: It has a default value. When the
1 min read
How href attribute is different from src attribute in HTML ?
In HTML5, the href and src attributes play distinct roles in defining paths or URLs, each associated with specific HTML elements. The href attribute, commonly found in an anchor (&lt;a&gt;) elements, points to the destination of hyperlinks, facilitating navigation. The src attribute, used with elements like &lt;img&gt; and &lt;script&gt;, specifies
1 min read
Explain the significance of &lt;head&gt; and &lt;body&gt; tag in HTML
The HTML &lt;head&gt; and &lt;body&gt; tags are the two most commonly used tags in HTML. It is very rare to find an industry-level website that does not use the &lt;head&gt; and &lt;body&gt; tag in its pages. In this article, we are going to learn the significance of these two tags in an HTML document. Significance of HTML &lt;head&gt; tag: The hea
3 min read
When to use the class attribute and the id attribute ?
The class attribute is used when multiple HTML elements share a common style or behaviour, allowing the application of a shared style to several elements. It promotes code reusability and is suitable for elements with similar characteristics. The id attribute is utilized when a unique identifier is needed for a specific HTML element. This identifie
1 min read
How to use the target attribute and the rel attribute in the &lt;a&gt; Tag ?
The target and rel attributes in the &lt;a&gt; (anchor) tag is used to control the behaviour of hyperlinks, specifying how the linked content should be opened and establishing relationships between the current and linked documents. Here's how to use these attributes: target Attribute:The target attribute determines where the linked content will be
2 min read