HTML Attributes

Please Share On:

  • HTML attributes provides the characteristics of HTML elements.
  • HTML attributes always defines in the HTML opening tag.
  • HTML attribues has two parts: a name and a value and it’s defines in the following syntax:
<p name = "value"></p>

Here, <p> is a HTML tag.

The name is the property that you want to set. Let’s use an align property in <p> tag. So, you will write like this

<p align ="value"> This is just an example of attribute. </p>

The value is the value of the above property and is always kept inside the quotation mark. The above property has three possible values: left, right and center. Let’s use one of these. Now, your HTML code will look like

<p align ="left"> This is just an example of attribute. </p>

Example:

<!DOCTYPE html>
<html>
  <head>
    <title>HTML Align Attribute</title>
  </head>

  <body>
    <h1>HTML Align Attribute</h1>
    <p align = "left" >I am left align.</p>
    <p align = "center" >I am center align.</p>
    <p align = "right" >I am right align.</p>
  </body>
</html>

Output:

Common HTML Attributes

Here, we will see the most used HTML attributes.

Note: Always write the attribute name in lowercase.

  1. href Attribute
  2. src Attribute
  3. alt Attriubute
  4. height and width Attribute
  5. id Attribute
  6. title Attribute
  7. class Attribute
  8. style Attribute
  9. lang Attribute

1) href Attribute:

Syntax:

<a href = "tryityourself.html"> Try it yourself <a>

Here, <a> the tag refers to a hyperlink and href attributes that specify the URL of the link.

Code:

<!DOCTYPE html>
<html>
  <head>
    <title>href Attributes</title>
  </head>
 
  <body>
    <h1>href Attributes</h1>
    <p align = "center">Click the below link to see how href attribute works upon clicking on the hyperlink text.</p>
    <p align = "center">
         <a href = "https://www.elsebazaar.com/blog/html-attributes/">Visit Elsebazaar's blog for tutorials.</a>
    </p>
   
  </body>
</html> 				
								

Output:

Continue Reading to the next page…

Leave a Reply

Your email address will not be published. Required fields are marked *

Copyright @2023. All Right Reserved.


Social media & sharing icons powered by UltimatelySocial