MicroData in HTML5
In this article I am going to describe how to implement and use the MicroData Attribute in HTML5
MicroData in HTML5
Microdata is one of the way to provide additional semantics in your web pages.Microdata consist of group name-value pairs.In Microdata group are called items and its name-value is called properties.For creating microdata item we use itemscope attribute and in order to add property to item we use itemprop.
Syntax
<p itemscope>some text <span itemprop="name">Name</span></p>
Browser supporting MicroData Attribute
Browser supporting MicroData attribute are Firefox, Chrome, Opera.
Attributes
| Attributes |
Description |
| itemscope |
use to create an item. |
| itemtype |
describe a valid URL to define the item and describe its property. |
| itemid |
define the unique id for the item. |
| itemprop |
define the property of an item. |
| itemref |
describe the additional properties of an item. |
Example of Microdata Attribute
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>MicroData in HTML5</title>
</head>
<body>
<h1>Use of microdata in HTML5</h1>
<div itemscope>
<p>Name:<span itemprop="Name">Sachin</span>.</p>
<p>Profile:<span itemprop="Profile">Software Developer</span>.</p>
<p>Salary:<span itemprop="Salary">10000</span>.</p>
<p>Company Name:<span itemprop="CompanyName">MCN Solution</span>.</p>
<p>Joining Date:<time itemprop="JoiningDate" datetime="1-24-2013">24th Jan 2013</time></p>
<img itemprop="image" src="/C:\Users\Public\Pictures\Sample Pictures/Tulips.jpg" alt="Flower" width="400" height="400" />
</body>
</html>
Output
