HTML <data> tag

Use of <data> tag

The <data> tag is new in HTML5. It defines a connection between given section or name with the machine-readable translation. It is useful when we like a particular formatted data but we don't want it to be seen by the visitors.
The simple example is giving a numeral value (like 001) by using value attribute. The <data> tag is always associated with value attribute.
Type: Inline Element

Note that: If the section is time-related or data-related content, we have to use <time> tag.

Example of <data> tag

<ul>
    <li> <data value="001"> HTML </data> </li>
    <li> <data value="002"> CSS </data> </li>
    <li> <data value="003"> PHP </data> </li>
</ul>

Supported Browsers

The following versions are the minimum versions that support the <data> tag fully.

Tag Chrome browser Internet explorer browser Firefox browser Safari browser Opera browser
<data> 62.0 Yes 22.0 not supported 49.0

Full Code Example

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<ul>
    <li> <data value="001"> HTML </data> </li>
    <li> <data value="002"> CSS </data> </li>
    <li> <data value="003"> PHP </data> </li>
</ul>
</body>
</html>

Output

  • HTML
  • CSS
  • PHP

Attribute value

Attribute Value Notes
value machine-readable format It defines machine-readable translation of corresponding section (like 001).