HTML - time 标签_HTML 菜鸟教程

HTML <time> 标签用于定义特定的日期和时间。它以 HTML 格式显示 24 小时制的时间或公历中的精确日期。它可能包含“datetime”属性，该属性将日期转换为机器可读格式，从而可以增强搜索引擎结果或自定义功能，例如提醒。

<time> 标签具有可选属性“datetime”，用于以 <time> 标签的机器可读形式表示日期/时间。

语法

<time>.....</time>

属性

HTML 时间标签支持 HTML 的全局属性和事件属性。下面还列出了特定属性：

属性	值	描述
datetime	datetime	表示 <time> 元素的机器可读的格式。

<time> 标签示例

下面的示例将说明时间标签的用法，以及在哪里、何时以及如何使用时间标签在上下文中呈现时间。

创建时间元素

使用 <time> 标签创建 time 元素。在下面的示例中，我们将创建一个 HTML 文档并演示 <time> 标签的工作原理。

<!DOCTYPE html>
<html>
<head>
	 <title>HTML time tag</title>
	 <style>
			time {
				 font-weight: bold;
			}
	 </style>
</head>
<body>
	 <h2>Example of time Tag</h2>
	 <p>
			The QikepuCom is celebrating their 10 <sup>th</sup> anniversary
			on <time datetime="2023-06-12">Jun 12</time> 
			in Hyderabad's office. </p>
	 <p>
			The concert will start at <time datetime="20:00">20:00</time> and 
			you'll be able to enjoy the band for at least <time datetime="PT2H30M">2h 30m</time>.
	 </p>
</body>
</html>

将 datetime 属性与 <time> 标签结合使用

我们可以在<time> 标签上提及一个机器可读的 datetime。

<!DOCTYPE html>
<html>
<head>
	 <title>HTML time tag</title>
	 <style>
			time {
				 font-weight: bold;
			}
	 </style>
</head>
<body>
	 <p>
			We open our shop at <time>09:00</time> am. 
	 </p>
	 <p>
			The business meeting is scheduled on 
			<time datetime="2023-06-16">this friday</time>.
			</p>
	 <p>
			The 10 <sup>th</sup> anniversary of QikepuCom
			scheduled at <time datetime="2023-06-12 T0 02:00-06:00">2pm last Monday </time>.
			</p>
</body>
</html>

支持的浏览器

浏览器
<time>	62.0	18.0	22.0	7.0	49.0

<< HTML - template 标签 HTML - var 标签 >>