Abbreviation in HTML5

How to display the abbreviation of the element in the webpage in HTML5?

The <abbr> tag is used to mark abbreviation or acronym of the words. In earlier <abbar> tag was acronym tag.

<body>
    It is used to mark abbreviation or acronym of the words. 
    <p>
        <abbr title="DotNetFunda.com">DNF</abbr>
        <span title="DotNetFunda.com">DNF</span>
    </p>


    Something is <span style="color:red;">good</span>.

</body>

In the above code snippet, we can notice that DotNetFunda.com is the title and DNF is placed in <abbr> tag, which means DNF is the abbrevation of DotNetFunda. Similarly the <span> tag will also give the same result as the <abbr> tag, however syntactically <abbr> tag is ideal here.

Output