Show List
Tutorials > HTML > HTML attributes

HTML attributes

HTML attributes provide additional information about HTML elements and are used to modify their behavior or appearance. Attributes are added to an element in the opening tag and have the following syntax:
<element attribute="value">
Here are a few examples of HTML attributes:

Common Attributes

Below are some attributes that are available with most of the elements:
  • id - Used to uniquely identify any element on the HTML page 
  • class - Used to classify the elements and assign common style
  • style - Used to assign the style to individual element inline
  • title - Used to add tool tip on the element
In the example below class "cityDiv" is assigned to all the divs so box-shadow, padding and margin style could be assigned together. 
<!DOCTYPE html>
<html>

<head>
    <style>
        .cityDiv{
            box-shadow: 1px 1px 3px #222222;
            padding: 10px;
            margin: 10px;
        }
    </style>
</head>

<body>
    <div id="london" class="cityDiv" title="London Title" >London</div>
    <div id="paris" class="cityDiv" title="Paris Title" >Paris</div>
    <div id="washington" class="cityDiv" title="Washington Title" style="background-color: orange" >Washington</div>
    <div id="montreal" class="cityDiv" title="Montreal Title" style="background-color: skyblue" >Montreal</div>
</body>

</html>
Output
London
Paris
Washington
Montreal

src

scr attribute is used with the images to provide the path of the image source.
<!DOCTYPE html>
<html>

<head>
</head>

<body>
    <img src="https://itcodescanner.com/images/howto.png" alt="How To" height="100" width="100">
</body>

</html>
Output:
How To

href

href attribute is used with <a> tags to provide the address of hyperlink.
<!DOCTYPE html>
<html>

<head>
</head>

<body>
    <a href="https://itcodescanner.com/?target=projectscanner">Visit Tutorials Page</a>
</body>

</html>
Output


Next: DOCTYPE

    Leave a Comment

  • captcha text