HTML文字層次語義元素
為了使HTML5頁面中的文字內容更加形象生動，需要使用HTML5中一些特殊的元素來突出文字之間的層次關係，這樣的元素被稱為層次語義元素。
time元素
time元素用於定義時間或日期，可以代表24小時中的某一時間。
time元素不會在瀏覽器中呈現任何特殊效果，但是該元素能以機器可讀的方式對日期和時間進行編碼，這樣，使用者能夠將生日提醒或其他事件新增到日程表中；
搜尋引擎也能夠生成更智慧的搜尋效果。
time元素有以下2個元素：
- datetime：用於定義相應的時間或日期。取值為具體時間或具體日期。不定義該屬性時，由元素的內容給定日期/時間。
- pubdate：用於定義time元素中的日期/時間是文件（或article元素）的釋出日期。取值一般為“pubdate”。
下面通過一個案例對time元素的用法進行演示：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>time元素的使用</title> </head> <body> <p>我們早上<time>9:00</time>開始上班</p> <p>今年的<time datetime="2019-08-15">十一</time>我們準備去旅遊</p> <time datetime="2019-08-15" pubdate="pubdate"> 本訊息釋出於2019年8月15日 </time> </body> </html>
執行效果如圖所示：
mark元素
mark元素的主要功能是在文字中高亮顯示某些字元，以引起使用者注意。
該元素的用法與em元素和strong元素有相似之處，但是使用mark元素在突出顯示樣式時更隨意靈活。
下面通過一個案例對mark元素的用法進行演示：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>mark元素的使用</title> </head> <body> <h3>小蘋果</h3> <p>我種下一顆<mark>種子</mark>,終於長出了<mark>果實</mark>,今天是個偉大日子。 摘下星星送給你，拽下月亮送給你，讓太陽每天為你升起。變成蠟燭燃燒自己，只為照亮你， 把我一切都獻給你，只要你歡喜。你讓我每個明天都變得有意義，生命雖短愛你永遠，不離不棄。 你是我的小呀<mark>小蘋果兒</mark>,怎麼愛你都不嫌多,紅紅的小臉兒溫暖我的心窩,點亮我生命的火 火火火火火.你是我的小呀<mark>小蘋果兒</mark>,就像天邊最美的雲朵,春天又來到了花開滿山坡,種 下希望就會收穫。</p> </body> </html>
執行效果如圖所示：
cite元素
cite元素可以建立一個引用標記，用於對文件中的引用進行說明。一旦在文件中使用了該標記，被標記的文件內容將以斜體的樣式展示在頁面中，以區別於段落中的其他字元。
下面通過一個案例對cite元素的用法進行演示：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>cite元素的使用</title> </head> <body> <p>待到秋來九月八，我花開後百花殺</p> <p>沖天香陣透長安，滿城盡帶黃金甲</p> <cite>————唐黃巢《不第後賦菊》</cite> </body> </html>
執行效果如圖所示：