HTML Tags Attribute: Some Important Attribute in HTML

HTML Tags Attributes

HTML tags attribute defines the characteristics of any HTML tag. These attribute provide additional information to the browser about the tag like, its size, color, behaviour, etc.

Some important points regarding HTML tag Attributes

  • Each element or tag can have attributes, which define the behaviour of that tag.
  • Attributes should always be aplied with Opening tag.
  • Attributes usually come in name/value pairs like: name="value"
  • Attribute name and values are cas sensitive, and it is recommended by W3C that it should be written in Lowercase only.
  • You can add multiple attributes in one HTML tag, but need to give space between two attributes.
Syntax
<tag attribute_name="value">content....</tag>
Example
<!DOCTYPE html>
<html>
    <head>
        <title>This is page title</title>
    </head>
    <body bgcolor="red">
        <h1>This is Heading Text</h1>
        <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Minus ipsum quaerat rem, aspernatur architecto quas fugiat porro
        deleniti ut voluptas accusamus voluptate obcaecati. Voluptatum earum eligendi reprehenderit enim incidunt voluptatem?</p>
    </body>
</html>

Output

html-body-attribute-bgcolor

Some Important Attribute Example in HTML

HTML Lang Attribute

The lang attribute is declared in the opening <html> tag. It gives information to the browser about the main language used in the html document. Although it is not necessary to use but using it is a good practice.

You can check all the values or lang attribute for different languages from here

Example
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>This is page title</title>
    </head>
    <body>
        <h1>This is Heading Text</h1>
        <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Minus ipsum quaerat rem, aspernatur architecto quas fugiat porro
        deleniti ut voluptas accusamus voluptate obcaecati. Voluptatum earum eligendi reprehenderit enim incidunt voluptatem?</p>
    </body>
</html>

Output

html-attribute-lang

HTML Title Attribute

The title attribute is used to specify a tooltip. That tooltip could be some important piece of information in text form. It is often displayed when cursor comes over the element or while element is loading.

Adding tooltip using title attribute, is a smart way to give brief explanation about some element on the webpage.

Example
<h1>
    <span title="Hypertext Markup Language">HTML</span> is the code that is used to structure a web page and its content.
</h1>

Output

html-attribute-title

HTML Src Attribute

The src or (source) attribute is used with <img> tag. This attribute al### HTML alt Attribute

The alt attribute specifies an alternative text for an image. If somehow the browser is not able to display an image, then the alternate text will be displayed, which will give the information about the image. Also, value of alt attribute can be read by screen readers, which helps visually impaired person to "hear" information about the image.lows us to provide the path for the image to be included on the webpage. it is also used with <audio> tag, <video> tag, <embed> tag, etc. to add the source path of the file to be included.

Example
<img src="https://www.hkrhasan.com/static/images/html.png" />

Output

html-attribute-src

HTML alt Attribute

The alt attribute specifies an alternative text for an image. If somehow the browser is not able to display an image, then the alternate text will be displayed, which will give the information about the image. Also, value of alt attribute can be read by screen readers, which helps visually impaired person to "hear" information about the image.

Example
<img src="https://www.hkrhasan.com/static/images/noimage.png" alt="image not found" />

Output

html-attribute-alt

HTML style Attribute

The style attribute is used to specify the inline style of an element, i.e., it defines the CSS styling of element like color, font, size, shadow etc.

Example
<h1 style="background-color:green;">This is a heading</h1>

Output

html-attribute-style