官术网_书友最值得收藏!

首頁 >

HTML5 Multimedia Development Cookbook

Specifying the pubdate of an article

"The pubdate attribute is a boolean attribute. If specified it indicates that the date and time given by the element is the publication date and time of the nearest ancestor <article> element, or, if the element has no ancestor <article> element, of the document as a whole." - WHATWG's HTML5 Draft Standard - http://whatwg.org/html5

Getting ready

The new pubdate is an attribute for the new <time> element when it exists within the new <article> element. It allows us to be even more precise when presenting the date and time of publication.

How to do it...

In this recipe we'll build on the new <time> element from the last recipe and add the new optional pubdate attribute to display our publication date.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<!--[if lt IE 9]><script src=http://html5shiv.googlecode.com/svn/trunk/html5.js> </script>[endif]-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<article>
<header>
<h2>Headline</h2>
<p>Published on <time datetime="2010-11-29" pubdate> November 29, 2010</time> in the something category.</p>
</header>
<p>First paragraph</p>
<p>Second paragraph</p>
<footer></footer>
</article>
<article>
<header>
<h2>Headline</h2>
<p>Published on <time datetime="2010-11-28" pubdate> November 28, 2010</time> in the something category.</p>
</header>
<p>First paragraph</p>
<p>Second paragraph</p>
<footer></footer>
</article>
</body>
</html>

How it works...

Pubdate is simply a binary variable, or Boolean, attribute to denote when something was published.

There's more...

You can think of pubdate as adding extra information to an element (<time>) that is already providing extra information. It is like the cherry on a sundae. And who doesn't like cherries on their sundaes?

Still waiting on browsers

We are getting really forward-thinking by including new elements like <mark>, <time>, and pubdate, as none are fully supported by any browser — yet.

Modern browsers like Firefox display the new <time> element and pubdate attribute natively without styling.

Extra credit

You can code the new pubdate Boolean attribute as <time datetime="2010-11-29" pubdate="pubdate"> if you want to conform to XML syntax.

Let's end confusion

Even though HTML5 is still quite new, there's already some confusion about the new pubdate Boolean attribute. Some think it should generate the date of publication based on your computer clock or a server. That's not its role. Its role is to produce a machine-readable publication date that is useful no matter what text you may put after it.

See also

Tantek Celik has created a very useful site at http://favelets.com that features all sorts of "bookmarklets" or in-browser JavaScript commands. Use these to do things like validate HTML5, CSS, and anchors all in the same window. Very helpful!

主站蜘蛛池模板： 奉贤区| 张家川| 济源市| 平乡县| 南皮县| 徐汇区| 海盐县| 读书| 汶川县| 全南县| 天镇县| 沧源| 沙田区| 洞口县| 敦化市| 天等县| 拜城县| 柳州市| 化德县| 陕西省| 启东市| 广元市| 阳泉市| 绥滨县| 焦作市| 榕江县| 东宁县| 桦甸市| 沂南县| 襄樊市| 荆州市| 英超| 大城县| 大兴区| 苏尼特右旗| 思茅市| 峨眉山市| 和硕县| 临沧市| 广丰县| 旌德县|