HTML del tag | belajar <del> element

HTML Fadlullah Fadul December 3, 2018

Referensi Belajar HTML del tag. Tutorial dan panduan mengenai element <del>...</del> yang digunakan untuk memberi keterangan konten yang telah dihapus. Mencakup penjelasan yang disertai contoh kode penggunaan sebagai rujukan untuk materi belajar HTML elemen <del>.

Deskripsi
Penjelasan HTML del

HTML <del> tag digunakan untuk menunjukkan konten yang telah dihapus (delete) dari dokumen. Browser biasanya memberi style garis tengah pada teks didalam element del, yang menunjukkan coretan atau dihapusnya teks tersebut dari dokumen.

Gunakan juga element <ins> untuk menyisipkan teks baru yang menunjukkan perubahan (Update) dari teks/konten yang telah dihapus, jika diperlukan.

Attributes
Atribut HTML Tag <del>

cite

Menentukkan URL atau alamat web yang merujuk pada penjelasan teks/konten tersebut dihapus.

Value: URL

datetime

Menentukkan waktu (time) dan tanggal (date) kapan teks atau konten tersebut dihapus. Penulisan format datetime harus valid dan mengikuti kaidah yang berlaku.

Value: YYYY-MM-DDThh:mm:ssTZD

Contoh:

  • datetime="2015-05-06T20:00+07:00" (Tanggal dengan waktu).
    T=Time (Waktu), +07:00 menunjukkan Waktu Indonesia Barat (WIB).
  • datetime="2015-05-06" (Hanya tanggal saja).

Pelajari selengkapnya mengenai HTML attribute datetime.

Global Attributes
Atribut Secara Global (Keseluruhan)

<del> tag mencakup global attributes, yang artinya tag tersebut dapat disisipkan semua attributes yang termasuk dalam global attributes yang secara umum berlaku untuk semua HTML tags.

Silahkan, lihat referensi mengenai HTML Global Attribute

Event Attributes
Atribut event (Peristiwa)

<del> tag mencakup event attributes, yang artinya attribute tersebut dijalankan ketika ada interaksi dari user atau dalam suatu peristiwa (kejadian). Contoh: menjalankan script (JavaScript) ketika halaman web pada jendela browser hendak ditutup, dan lain sebagainya.

Silahkan, lihat referensi mengenai HTML Events Attribute

Example
Contoh HTML <del> element

Contoh 1
HTML 
<p>
<del>Kalimat ini sudah dihapus</del>
</p>
Contoh 2

Contoh HTML <del> element dengan attribute datetime.

HTML 
<h2>Kegiatan Hari Ini</h2>
<ul>
  <li>Menghadiri Resepsi Pernikahan</li>
  <li><del datetime="2015-06-11T06:00+07:00">Beres-beres rumah</del></li>
  <li><del datetime="2015-06-11T09:00+07:00">Memasak</del></li>
  <li>Membeli Notebook</li>
</ul>

Pada contoh diatas, baris ke-4 dan ke-5 menunjukkan kegiatan yang sudah dilakukan yang ditandai dengan dicoretnya teks tersebut menggunakan element <del> berikut keterangan tanggal dan waktu selesai dikerjakannya.

Contoh 3

Contoh HTML <del> element dengan attribute cite

HTML 
Budi menjual mobil bekas di <del cite="http://blog.olx.co.id/blog/tokobagus-com-berubah-nama-menjadi-olx-co-id/">tokobagus.com</del> <ins>olx.co.id</ins>

Pada contoh diatas, tokobagus.com dicoret (delete) dan disisipkan (insert) kata olx.co.id. Perubahan ini dikarenakan tokobagus.com sudah berganti nama menjadi olx.co.id. Attribute cite digunakan untuk merujuk pada alamat web yang menjelaskan perubahan nama tersebut.

Contoh Lengkap

Contoh source code lengkap disertai dengan link "editor" untuk mencoba (try it) dan melihat hasil (preview) kode.

SOURCE
editor 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Demo HTML del tag</title>
    <style>

    </style>
  </head>
  <body>
    <h3>Contoh 1</h3>

    <p>
      <del>Kalimat ini sudah dihapus</del>
    </p>

    <hr />
    <h3>Contoh 2</h3>

    <h2>Kegiatan Hari Ini</h2>
    <ul>
     <li>Menghadiri Resepsi Pernikahan</li>
     <li><del datetime="2015-06-11T06:00+07:00">Beres-beres rumah</del></li>
     <li><del datetime="2015-06-11T09:00+07:00">Memasak</del></li>
     <li>Membeli Notebook</li>
    </ul>

    <hr />
    <h3>Contoh 3</h3>

    <p>
    Budi menjual mobil bekas di <del cite="http://blog.olx.co.id/blog/tokobagus-com-berubah-nama-menjadi-olx-co-id/">tokobagus.com</del> <ins>olx.co.id</ins>
    </p>

  </body>
</html>
SHARE
Previous Article Next Article