HTML ins tag | belajar <ins> element

Referensi Belajar HTML ins tag. Tutorial dan panduan mengenai element <ins>...</ins> yang digunakan untuk menyisipkan teks dalam dokumen. Mencakup penjelasan yang disertai contoh kode penggunaan sebagai rujukan untuk materi belajar HTML elemen <ins>.


Deskripsi
Penjelasan HTML ins

HTML <ins> element merepresentasikan sebuah teks yang dimasukkan atau disisipkan (inserted text) dalam sebuah dokumen.

<ins> ditulis beriringan dengan element <del> yang biasanya digunakan untuk memperbaharui (update) teks atau konten tertentu, <del> menunjukkan konten yang dihapus (ditandai dengan tulisan yang dicoret) sedangkan <ins> menunjukkan konten baru yang dimasukkan, sebagai pembaharuan dari konten lama yang dihapus tersebut.

Attributes
Atribut HTML Tag <ins>

cite

Menentukkan URL atau alamat web yang merujuk pada penjelasan teks/konten tersebut disisipkan (inserted).

Penulisannya, dapat dilihat pada Contoh 3 dibawah.

datetime

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

Pelajari selengkapnya mengenai HTML attribute datetime.


Global Attributes
Atribut Secara Global (Keseluruhan)

<ins> 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.

Event Attributes
Atribut event (Peristiwa)

<ins> 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.

Example
Contoh HTML <ins> element

Contoh 1

Contoh penambahan (menyisipkan) sebuah paragraf (<p>) pada sebuah <article> element.

HTML
<article>
  <ins>
    <p> Saya suka buah-buahan.</p>
  </ins>
</article>
Contoh 2

Cara terbaik untuk me-markup <ins> yang terdiri dari satu element yang menunjukkan lebih dari satu kalimat (ungkapan).

HTML
<aside>
  <ins datetime="2015-08-17 09:00">
    <p> Saya suka buah-buahan. </p>
  </ins>
  <ins datetime="2015-08-17 09:00">
    Apel rasanya <em>enak</em>.
  </ins>
  <ins datetime="2015-09-20 09:00">
    Begitu juga jeruk.
  </ins>
</aside>
Contoh 3

Contoh HTML element <ins> yang digunaan beriringan dengan element <del>.

HTML
<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>

Contoh diatas, tokobagus.com dicoret (strike) dan disisipkan (inserted text) kata olx.co.id. Perubahan ini dikarenakan tokobagus.com sudah berganti nama menjadi olx.co.id. Attribute cite berisi URL yang 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
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Demo HTML ins tag</title>
    <style></style>
  </head>
  <body>
    <h3>Contoh 1</h3>

    <article>
      <ins>
        <p> Saya suka buah-buahan.</p>
      </ins>
    </article>

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

    <aside>
     <ins datetime="2015-08-17 09:00">
      <p> Saya suka buah-buahan. </p>
     </ins>
     <ins datetime="2015-08-17 09:00">
       Apel rasanya <em>enak</em>.
     </ins>
     <ins datetime="2015-09-20 09:00">
      Begitu juga jeruk.
     </ins>
    </aside>

    <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