HTML title Attribute
The HTML title global attribute provides advisory information about the element on which it appears. Browsers may make this information available to users as a tooltip or through another interface, but important information should not rely on the title attribute alone.
Elements That Use the title Attribute
The title attribute is a global attribute and can be specified on all HTML elements. Some elements, including <abbr>, <link>, and certain form controls, give the attribute additional or more specific meaning.
title Attribute Value
The value of the title attribute is text containing advisory information related to the element.
<p title="Additional information about this paragraph">
Move the pointer over this paragraph.
</p>A title value can also contain line feed characters. Each line feed represents a line break in the advisory information.
Tooltips
On systems that use a pointing device, browsers commonly display title information as a tooltip when the pointer remains over an element.
<a href="contact.html" title="Visit our contact page">Contact Us</a>A tooltip is only one possible way a browser can expose the information. Authors should not depend on a tooltip being available to every user.
Title Inheritance
If an element does not have its own title attribute, advisory information can be inherited from the nearest ancestor that has one.
<div title="Additional information">
<p>This paragraph can inherit the advisory information.</p>
</div>Adding a title attribute to a descendant overrides the inherited advisory information. An empty title="" explicitly indicates that the ancestor's advisory information does not apply to that element.
<div title="Additional information">
<p title="">The ancestor's title does not apply here.</p>
</div>Using title with <abbr>
When title is used on an <abbr> element to provide an expansion of an abbreviation or acronym, the value should contain the full expansion.
<abbr title="HyperText Markup Language">HTML</abbr>When practical, provide the expanded term in visible text when it is first introduced instead of depending entirely on the title attribute.
Special Uses of title
Some HTML elements define additional meaning for the title attribute. For example, the attribute can identify an <iframe> for assistive technology, and on certain <link> elements it participates in naming style sheet sets.
<iframe src="contact.html" title="Contact page"></iframe>The title attribute on an <iframe> should briefly identify the content or purpose of the embedded document so users of assistive technology can distinguish it from other frames.
Accessibility Considerations
Do not rely on the title attribute as the only way to provide information that users need to understand or operate the page. Its presentation varies among browsers and devices, and tooltip-style information can be difficult or impossible to access for keyboard-only and touch-screen users.
Whenever information is important, provide it as visible text or through an appropriate accessible HTML structure. For form controls, use a <label> when a visible label is appropriate rather than depending on title as the primary labeling method.
Common Mistakes
Do not confuse the title attribute with the <title> element. The title attribute provides advisory information about an element, while the <title> element defines the title of the HTML document.
Do not rely on title tooltips to provide instructions or other information that users must be able to access.
Do not assume that every device displays title information when an element is hovered. Touch devices, keyboard navigation, browsers, and assistive technologies can expose the information differently or may not make it conveniently available.
Do not use an abbreviation's title value for unrelated descriptive information when it is intended to provide the abbreviation's expansion.
Browser Support
Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.
The title global attribute is widely supported in current core browsers. How its advisory information is presented can vary by browser, device, and input method.
Checking Browser Support
For current browser compatibility information, visit Can I Use? . Search for the HTML element or attribute you want to check. You can also narrow your search by entering an element name and attribute name separated by a colon. Search results can include related HTML features, element attributes, input types, APIs, and other technologies, so select the result that most closely matches the feature you are checking.
Try the title Attribute
The example adds title attributes to several elements. On browsers and devices that display title information as a tooltip, move the pointer over the examples to view the advisory text.
Summary
The HTML title global attribute provides advisory information related to an element. Browsers may present this information as a tooltip or through another interface. The attribute can also have additional meaning on certain elements. Because access to title information varies among browsers, devices, and assistive technologies, important information should also be provided in a more accessible form.