HTML title Attribute

 

ATTENTION: THIS PAGE IS Valid HTML 5 AND IS BEST VIEWED WITH HTML 5 - Please upgrade your browser or download one of the HTML 5 compatible browsers such as Mozilla Firefox, Chrome, Opera or IE 9 (March 14, 2011 or later). For more information see HTML 5 browsers.


If you find this helpful, please click the Google +1 Button to the left, if it is white, to make it turn blue or red. Thank you! (It also helps find this page again more easily.)


PDF mobile

The title attribute in HTML

The title attribute provides a description or other information for an HTML element, such as:

Many web browsers take the text in the title attribute and display it in a pop-up tool tip when the mouse is held over content with a title.

For most HTML elements, the value of the title property is inherited from the parent element or the closest ancestor with a title unless the title attribute is coded on the element. A value of an empty string (title="") indicates there is no title for the element. Line breaks in the title attribute are preserved. Therefore, the title should not be split across multiple lines.

Examples
Image link
<a href="http://www.ExampleOnly.com/todos/take-out-trash.html" title="Take out the trash">
   <img src="/images/trash-can.png" alt="trash can"/>
</a>

When the a element and img element represent the same resource or event, the title attribute should be put on the outermost element, which in this case is the hypertext link created by the <a> tag. Since there is no title attribute on the <img> tag, the value of the title property of the img element will be inherited from the title property of the a element.

Link with image and text
<a href="http://www.ExampleOnly.com/todos/take-out-trash.html" title="Take out the trash">
<img src="/images/task-not-done.png" alt="task not done" title=""/> Take out the trash</a>

In this case, the a element represents a different resource (a task in a "To Do" list) than the image element (the status of the task). Therefore the title property of the img element should not be inherited from the <a> tag, which requires coding the title attribute on the <img/> tag. The value of the title property is an empty string since the <img alt> attribute provides the description of the image.

Other examples of the title attribute

Valid HTML 5