w3resource

HTML abbr attribute


abbr Attribute

The HTML abbr attribute provides an abbreviated version of the content within table cells ( or ). This improves accessibility (e.g., for screen readers) or when space-constrained representations of the content are needed.

Important Note for HTML5:

In HTML5, the abbr attribute is only valid on elements, not . For HTML 4.01, it is supported on both.


Supported Elements

  • <th> (HTML 4.01 & HTML5)
  • <td> (HTML 4.01 only)

Syntax

<td abbr="text">...</td>  <!-- HTML 4.01 only -->
<th abbr="text">...</th>

Values

  • Text: A shortened form of the cell’s content.
  • Default: None.

Example 1: abbr with <td> (HTML 4.01)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>abbr Attribute with td Example</title>
</head>
<body>
  <table>
    <tr>
      <td abbr="UK">United Kingdom</td>
      <td>London</td>
    </tr>
    <tr>
      <td abbr="USA">United States of America</td>
      <td>Washington, D.C.</td>
    </tr>
  </table>
</body>
</html>

Result

United Kingdom	London
United States of America	Washington, D.C.

View this example in a separate browser window

Example of HTML abbr attribute with td.


Example 2: abbr with <th> (HTML 4.01/HTML5)

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>abbr Attribute with th Example</title>
</head>
<body>
  <table>
    <tr>
      <th abbr="Country">Cntry</th>
      <th abbr="Capital">Cap.</th>
    </tr>
    <tr>
      <td>UK</td>
      <td>London</td>
    </tr>
  </table>
</body>
</html>

Result

Cntry	Cap.
UK	London

View this example in a separate browser window

Example of HTML abbr attribute with th.

Previous: What is an HTML attribute
Next: HTML accept-charset attribute

Test your Programming skills with w3resource's quiz.



Follow us on Facebook and Twitter for latest update.