日付や時刻を表示したい

日時を表示したいときは、<time>タグを使います。<time>~</time>の中に含めるテキストは、日時をさすようなものであれば、どんなフォーマットでも可能です。<time>タグの最大の特徴は、datetime属性を追加できることです。datetime属性にはコンピュータが理解できるフォーマットで日時を指定します。たとえば、検索エンジンのクローラーがこの属性に書かれている日時を解析してくれれば、検索結果に多少なりとも反映される可能性があります。

<time datetime="フォーマットされた日時">日付・時刻</time>

<time>2024/04/15</time>　　　 ※西暦と時間表記
<time>平成26年10月1日</time>  ※年号を含めた表記
<time>30分前</time>           ※相対的な時間の指定

サンプル

<body>
    <ul>
        <li><time datetime="2024-10-01">2024年10月1日</time>アンケートを実施する予定です。</li>
        <li><time datetime="2024-09-05">2024年9月5日</time>社内で特選らーめんを販売します。</li>
        <li><time datetime="2024-03-12">2024年3月12日</time>健康診断を実施する予定です。</li>
        <li><time datetime="2023-10-01">2023年10月1日</time>社内の懇親会を実施する予定です。</li>
    </ul>
</body>

timeタグについて

<time>タグにはdatetime属性を追加することができます。この属性には、国際規格で定められた書式で日時を指定します。datetime属性の基本的な書式は次の通りです。

書式

datetime="年年年年-月月-日日T時時：分分：秒±時差"

datetime属性の日時の記述例

例	実際の日時
2024-10-01	2024年10月1日
2024-10-01-T17：00	2024年10月1日17時00分
2024-10-01-T12：00-0900	2024年10月1日12時00分

カテゴリー:WEB