HTML time Tag

Tutorial HTML <time>

Element HTML time digunakan untuk menulis format tanggal dan waktu. Dalam penulisannya, element <time> berpatokan kepada format masehi dalam kalender.

Element <time> jika dalam penulisannya tanpa diikutsertakan attribute datetime, maka sifatnya wajib mengikuti format standar international ISO 8601 dan tidak boleh ada element html apapun didalamnya.

Contoh HTML <time>

<p>
 Rapat hari ini akan dibuka pada pukul <time>08:40</time>
 dan kalau sesuai jadwal akan ditutup pada pukul <time>11:00</time>
</p>

Contoh HTML <time>

<h2>Contoh Yang benar</h2>
<ol>
  <li>Nama : Muhammad Nafis</li>
  <li>Tanggal lahir : Palangka Raya, <time>2009-04-25</time></li>
  <li>Hobby : Membaca</li>
</ol>

<hr>

<h2>Contoh Yang salah</h2>
<p>Attribute datetime diperlukan, jika formatnya seperti ini</p>

<ol>
  <li>Nama : Muhammad Nafis</li>
  <li>Tanggal lahir : Palangka Raya, <time>25-04-2009</time></li>
  <li>Hobby : Membaca</li>
</ol>

<hr>

<h2>Contoh Yang salah</h2>
<p>Attribute datetime diperlukan, jika formatnya seperti ini</p>

<ol>
  <li>Nama : Muhammad Nafis</li>
  <li>Tanggal lahir : Palangka Raya, <time>25 April 2009</time></li>
  <li>Hobby : Membaca</li>
</ol>

<hr>

<h2>Contoh Yang salah</h2>
<p>Attribute datetime diperlukan, jika element html ingin disematkan</p>

<ol>
  <li>Nama : Muhammad Nafis</li>
  <li>Tanggal lahir : Palangka Raya, <time><b>2009-04-25</b></time></li>
  <li>Hobby : Membaca</li>
</ol>

Attribute HTML <time>

datetime

Attribute ini digunakan untuk menentukan format tanggal dan waktu yang bisa dipahami oleh mesin pembaca

value : YYYY-MM-DDThh:mm:ssTZD

#	Keterangan
YYYY	menentukan tahun, misal : 2017
MM	menentukan bulan, misal : 05 untuk bulan mei, 12 untuk bulan desember
DD	menetukan tanggal, misal : 12 untuk tanggal 12
T	memberi info bahwa keterangan waktu juga disertakan, value ini harus ditulis dengan huruf besar, dan diikuti value keterangan waktu seperti hh, mm, ss Misal : T09:00 (jam:menit) atau T09:00:55 (jam:menit:detik). Catatan : Value T bisa diganti dengan space
hh	menentukan jam, misal : (09 untuk jam 9 pagi), (21 untuk jam 9 malam)
mm	menentukan menit, misal (03 untuk menit ke tiga), (50 untuk menit ke lima puluh)
ss	menentukan detik, misal (03 untuk detik ke tiga), (50 untuk detik ke lima puluh)
TZD	Time Zone Designator yang berarti menentukan Zona Waktu, Z menunjukkan Zulu, atau yang akrab didengan dengan Greenwich Mean Time GMT (UTC+00:00). Untuk indonesia WIB, TZD yang digunakan adalah +07:00 contoh 1 : datetime="2016-01-06T20:00+07:00" artinya (tahun 2016 bulan januari tanggal enam, jam delapan malam WIB.). contoh 2 : datetime="2016-01-06 20:00+07:00" artinya sama dengan contoh nomor 1, yang membedakannya cara penulisan dengan menggunakan value T dengan space.

Contoh 1 :

<p>
 Materi akan dilanjutkan setelah 
 <time datetime="09:30"><em>coffee break</em></time>
</p>

Contoh 2 :

<ol>
  <li>Nama : Muhammad Nafis</li>
  <li>Tanggal lahir : Palangka Raya, 
     <time datetime="2009-04-25">25 April 2009</time>
  </li>
  <li>Hobby : Membaca</li>
</ol>

Contoh 3 :

<!--contoh 1-->
<p>
  Besok kita akan memperingati
  <time datetime="2017-11-09"><i>Hari Pahlawan</i></time>
</p>

<!--contoh 2-->
<p>
  Besok kita akan memperingati
  <time datetime="11-09"><i>Hari Pahlawan</i></time>
</p>

<!--Penulisan yang salah-->
<p>
  Besok kita akan memperingati
  <time datetime="09-11-2017"><i>Hari Pahlawan</i></time>
</p>

Global Attributes:

Element <time> mencakup Global Attributes HTML.

Event Attributes:

Element <time> mencakup Event Attributes HTML.

Browser Support :

HTML
Element	Chrome	Safari	Firefox	Opera	IE / Edge
<time>	6.0	5.0	22	11.1	9.0
Nilai pada table menentukan minimal versi browser

Default CSS :

Browser yang support dengan element <time>, mempunyai nilai default :

/* tidak ada */