Tutorial Text HTML Part 7: Cara Membuat Kutipan di dalam HTML (tag blockquote dan tag q)

Dalam penulisan text, terutama artikel ilmiah, kita akan sering membuat kutipan yang berasal dari sumber-sumber referensi. Untuk penulisan kutipan, HTML memiliki 2 buah tag khusus, yakni tag <blockquote> dan tag <quote>. Pada tutorial Text HTML kali ini kita akan membahas Cara Membuat Kutipan di dalam HTML.


Tag <blockquote> Untuk Membuat Kutipan Panjang HTML

Tag <blockquote> digunakan untuk bagian text yang merupakan kutipan panjang. Disebut kutipan panjang karena tag ini merupakan tipe block element, sehingga akan memisahkan diri dari text yang ada menjadi baris baru. Tag <blockquote> lebih cocok digunakan untuk memberikan penegasan penting untuk kutipan.

Selain untuk kutipan, sering juga tag ini digunakan untuk penulisan testimoni.

Berikut adalah contoh cara penulisan dan penggunaan tag <blockquote> di dalam HTML:

<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML di Duniailkom</title>
</head>

<body>
<h3>Saya sedang belajar HTML di Duniailkom.com</h3>
<p>HTML atau Hypertext Markup Language adalah dasar dari semua 
halaman web di internet.</p>
<p>Berikut adalah defenisi HTML dikutip dari Wikipedia: </p>
<blockquote>HTML or HyperText Markup Language is the standard 
markup language used to create web pages. 
HTML is written in the form of HTML elements consisting of tags 
enclosed in angle brackets.</blockquote>
</body>

</html>

Contoh Cara Membuat Kutipan Panjang dalam HTML - tag blockquoteSeperti yang terlihat, secara default Web browser menampilkan tag <blockquote> sebagai paragraf baru dan dijorokkan (indent) beberapa pixel pada awal dan akhir text.


Tag <q> Untuk Membuat Kutipan Pendek HTML

Tag <q> adalah versi inline dari tag <blockquote>. Tag ini digunakan untuk kutipan pendek yang akan 'menyatu' dengan text yang ada saat ini karena sifatnya yang termasuk tipe inline element.

Didalam spesifikasi HTML, Web browser akan menampilkan text yang berada di dalam tag <q> berada didalam tanda kutip.

Berikut adalah contoh cara penulisan dan penggunaan tag <q> di dalam HTML:

<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML di Duniailkom</title>
</head>

<body>
<h3>Saya sedang belajar HTML di Duniailkom.com</h3>
<p>Andi berkata, <q>Jadilah diri anda sendiri</q>
</body>

</html>

Contoh Cara Membuat Kutipan Pendek dalam HTML - tag qSeperti yang terlihat, web browser akan menambahkan tanda kutip untuk tag <q>, walaupun kita tidak menuliskannya di dalam text.

16 Comments

  1. Ingin Kabari
    11 Apr 15
  2. roni
    25 Nov 15
    • Andre
      27 Nov 15
  3. Indra
    27 Jul 16
    • Andre
      28 Jul 16
      • kurnia
        09 Jun 20
  4. awhy
    07 Jan 17
    • Andre
      08 Jan 17
  5. Efri
    06 Aug 17
  6. yusuf
    27 Oct 17
  7. Joko Prayogo
    08 May 20
    • Joko Prayogo
      08 May 20
  8. PENELTIAN.ID
    30 Nov 22
    • Andre
      30 Nov 22

Add Comment

Leave a Reply to Joko Prayogo Cancel reply