Kutipan HTML (Quotation HTML), HTML menyediakan beberapa cara untuk menambahkan kutipan ke dalam dokumen web. Salah satu cara yang paling umum adalah menggunakan elemen <blockquote> untuk menandai kutipan panjang dan elemen <q> untuk menandai kutipan pendek. Berikut adalah contoh penggunaan kedua elemen tersebut:
Elemen <blockquote>
Contoh kutipan panjang dengan elemen <blockquote>:
<blockquote>
<p>"Kebahagiaan bukanlah sesuatu yang siap pakai. Ia datang dari tindakan
kita sendiri."</p> <footer>- Dalai Lama</footer>
</blockquote>
Pada contoh di atas, elemen <blockquote> digunakan untuk menandai kutipan panjang. Isi kutipan tersebut ditempatkan di dalam elemen <p> dan diakhiri dengan elemen <footer> yang digunakan untuk menampilkan nama penulis kutipan.
Elemen <q>
Contoh kutipan pendek dengan elemen <q>:
<p>Menurut <q>Albert Einstein</q>, "Kreativitas adalah kecerdasan yang bersenang-senang."</p>
Pada contoh di atas, elemen <q> digunakan untuk menandai kutipan pendek. Kutipan tersebut ditampilkan di dalam kalimat menggunakan elemen <p>.
Selain elemen <blockquote> dan <q>, HTML juga menyediakan elemen <cite>, <address> ,<bdo> dan elemen <abbr> untuk menandai singkatan.
Elemen <cite>
Elemen <cite> digunakan untuk menandai sebuah kutipan atau sumber informasi yang diambil dari sumber lain. Biasanya, elemen <cite> digunakan bersamaan dengan elemen <blockquote> atau <q>.
Berikut ini adalah contoh penggunaan elemen <cite>:
<blockquote> <p>"Kebahagiaan bukanlah sesuatu yang siap pakai. Ia
datang dari tindakan kita sendiri."</p> <footer><cite>Dalai
Lama</cite></footer> </blockquote>
Pada contoh di atas, elemen <cite> digunakan untuk menandai sumber kutipan yaitu Dalai Lama.
Elemen <address>
Elemen <address> digunakan untuk menampilkan informasi kontak dari penulis atau pemilik halaman web. Biasanya, informasi yang ditampilkan meliputi alamat, nomor telepon, dan alamat email.
Berikut ini adalah contoh penggunaan elemen <address>:
<address>
<p>Jalan Raya 123, Kota Jakarta</p> <p>Telp:
021-123456</p> <p>Email: info@contoh.com</p>
</address>
Pada contoh di atas, elemen <address> digunakan untuk menampilkan informasi kontak dari pemilik halaman web.
Elemen <bdo>
Elemen <bdo> digunakan untuk mengubah arah penulisan teks. Elemen ini berguna untuk menampilkan teks dari kanan ke kiri pada bahasa yang ditulis dari kanan ke kiri seperti bahasa Arab atau Ibrani.
Berikut ini adalah contoh penggunaan elemen <bdo>:
<p><bdo dir="rtl">سلام</bdo></p>
Pada contoh di atas, elemen <bdo> digunakan untuk menampilkan kata "سلام" dari kanan ke kiri karena bahasa Arab ditulis dari kanan ke kiri.
Elemen HTML <abbr>
Elemen HTML <abbr> digunakan untuk menandai singkatan dan akronim pada halaman web. Elemen ini memberikan informasi tambahan tentang singkatan atau akronim yang ditampilkan pada halaman web, yang dapat membantu pengguna memahami konten yang ditampilkan.
Berikut ini adalah contoh penggunaan elemen <abbr>:
<p>HTML adalah <abbr title="Hyper Text Markup Language">bahasa
markup</abbr> yang digunakan untuk membuat halaman web.</p>
Pada contoh di atas, elemen <abbr> digunakan untuk menandai singkatan HTML dan memberikan informasi tambahan tentang singkatan tersebut. Atribut title pada elemen <abbr> digunakan untuk menampilkan informasi tambahan tersebut ketika pengguna mengarahkan kursor ke singkatan tersebut.
Anda juga dapat menambahkan atribut lang pada elemen <abbr> untuk menunjukkan bahasa yang digunakan pada singkatan tersebut.
Berikut ini adalah contoh penggunaan atribut lang pada elemen <abbr>:
<p>UNESCO adalah <abbr title="United Nations Educational, Scientific and Cultural
Organization" lang="en">organisasi PBB</abbr> yang berfokus pada
pendidikan, sains, dan kebudayaan.</p>
Pada contoh di atas, atribut lang digunakan untuk menunjukkan bahwa singkatan UNESCO berasal dari bahasa Inggris.
Dalam penggunaan elemen <abbr>, pastikan untuk memilih singkatan atau akronim yang relevan dengan konten halaman web Anda dan mengikuti standar penggunaan yang benar. Selain itu, pastikan juga untuk memberikan informasi tambahan yang jelas dan mudah dipahami oleh pengguna.
Dengan menggunakan elemen-elemen tersebut, Anda dapat membuat kutipan yang lebih kaya dan informatif di dalam dokumen web Anda.