Tutorial Formating Text HTML: Cara Membuat Kutipan di HTML

Halo gan. Di postingan sebelumnya, kita sudah membahas cara membuat huruf superscript dan subscript di HTML.

Kita review sedikit. Superscript adalah teks kecil yang ada di sisi kanan atas teks lain. Cara membuat huruf superscript adalah dengan menggunakan tag <sup>.

Sedangkan subscript adalah teks kecil yang ada di sisi kanan bawah teks lain. Cara membuat huruf subscript adalah dengan menggunakan tag <sub>.

Kali ini, kita akan bahas cara membuat kutipan atau quote di HTML. Ada 2 cara untuk membuat kutipan di HTML, yakni dengan tag <blockquote> dan dengan tag <q>.

membuat kutipan di html

Membuat kutipan dengan tag <blockquote>

Jika kita ingin membuat kutipan yang panjang, yang lebih dari 1 baris, atau yang ingin terpisah dari teks lainnya, gunakan tag <blockquote>.

Tag <blockquote> merupakan tag berjenis block element, sehingga akan berpindah baris baru dan terpisah dari teks lain.

Selain kutipan, tag tersebut juga cocok bila digunakan untuk penulisan testimoni.

Berikut ini contoh kode HTML-nya.
<!DOCTYPE html>
<html>
  <head>
    <title>Membuat kutipan di HTML</title>
  </head>
  <body>
    <p>Berikut pengertian HTML yang dikutip dari Wikipedia:</p>
    <blockquote>Hyper Text Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi.</blockquote>
  </body>
</html>

Seperti ini jadinya:

membuat quote di html

Teks yang diberikan tag <blockquote> akan ditampilkan menjorok ke kanan oleh web browser seperti terlihat pada gambar di atas.

Membuat kutipan dengan tag <q>

Kalau tag <blockquote> tadi membuat kutipan dengan block, maka tag <q> ini adalah versi inline-nya. Tag <q> akan membuat kutipan yang menyatu dengan teks di sekitarnya dan tidak membuat baris baru.

Secara otomatis, tag <q> akan ditampilkan dengan tanda kutip. Seperti ini contoh kode HTML-nya.
<!DOCTYPE html>
<html>
  <head>
    <title>Membuat kutipan di HTML</title>
  </head>
  <body>
    <p> Tadi, ane bilang, <q>Jangan bosan mampir ke AneIqbal ya!<q></p>
  </body>
</html>

Jadinya akan seperti ini.

membuat kutipan di html

Nah, terlihat kan ada kutipnya di gambar di atas walaupun di kode HTML-nya tidak kita tulis tanda kutip.

Seperti itulah cara membuat kutipan di HTML. Selanjutnya, kita akan bahas cara membuat teks HTML tanpa format di HTML.



0 Komentar untuk "Tutorial Formating Text HTML: Cara Membuat Kutipan di HTML"