htmlで日付・時間の表示「time要素」ＨＴＭＬ５
htmlで日付・時間を表示する方法は、「time要素」でマークアップします。
「time要素」は、ＨＴＭＬ５で新たに導入された要素で、ブラウザ・検索エンジンでは正確に日時を認識できます。
「datetime属性」で、タグの中に日時のデータを入れて、マシン上は「日付・時間」を認識して、ブラウザ表示上は日本語の年月日時分で表現できます。
「time要素」のマークアップ例
下記の書式通りにマークアップします。「+09:00」は、日本の場合のグリニッジ標準時との時差を表します。時差の無い国（イギリスなど）の場合は「Z」と大文字で記載します。サマータイムを導入している国・地域の場合は、サマータイム期間中は１時間マイナスして記載します。
ＨＴＭＬソース
年の場合
<time>2015</time>
年月の場合
<time>2015-07</time>
年月日の場合
<time>2015-07-17</time>
年月日時分の場合
<time>2015-07-17T16:11+09:00</time>
年月日時分秒の場合
<time>2015-07-17T16:11:59+09:00</time>
年月日時分秒1/10秒の場合
<time>2015-07-17T16:11:59.3+09:00</time>ブラウザ表示
年の場合
年月の場合
年月日の場合
年月日時分の場合
年月日時分秒の場合
年月日時分秒1/10秒の場合
「datetime属性」のマークアップ例
上記の表示では、マシンには認識されても、ブラウザの表示上ではわかりにくいので、マシンには「datetime属性」でデータを読ませ、時を示す日本語をテキストに記載する事で、わかり易く、音声読み上げにも対応できます。
ＨＴＭＬソース
<time datetime="2015-07-17T19:00+09:00">開催日時：2015年7月17日 金曜日 午後7時</time>ブラウザ表示
ＨＴＭＬ５ に戻る
ホームページ作成方法 TOPに戻る