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>
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> </head> <body> <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> </body> </html>
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>
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> </head> <body> <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> </body> </html>
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 . |
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 */