- HTML5 Multimedia Development Cookbook
- Dale Cruse Lee Jordan
- 368字
- 2021-04-02 19:27:38
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!
- 軟件定義數據中心:技術與實踐
- Photoshop CS6平面設計應用教程(第4版)
- Flash CS6標準教程(全視頻微課版)
- SketchUp印象 城市規劃項目實踐(第2版)
- Creo 6.0快速入門、進階與精通(升級版)
- InDesign平面設計案例教程:從設計到印刷
- DSP開發寶典
- AutoCAD 2018中文版從入門到精通
- 計算機圖形圖像處理Photoshop CS6項目教程
- Maya 2020基礎教材
- Flash基礎與實戰教程
- AutoCAD 2016入門與提高(超值版)
- JBoss AS 5 Performance Tuning
- 攝影師的后期課:RAW格式技法篇
- Android APP開發實戰:從規劃到上線全程詳解