Iklan bawah header

Belajar HTML Part 19 - Cara Membuat Kutipan di HTML

membuat teks kutipan di html

Sebelumnya kita sudah belajar mengenai tag subscript dan superscript di html, nah pada tutorial kali ini kita akan membahas mengenai bagaimana cara membuat teks kutipan di HTML.

Untuk membuat teks kutipan di html kita bisa menggunakan tag <blockquote> dan <q>. Baiklah langsung saja kita bahas mengenai fungsi dari kedua tag tersebut.

Tag <bockquote>

Tag blockquote digunakan untuk membuat sebuah kutipan teks yang cukup panjang. Tag ini bersifat block element, yang berarti jika tag ini digunakan maka secara otomatis akan berpindah baris teksnya.

Kalau kalian bingung, bisa kalian perhatikan contoh dibawah ini :

<!DOCTYPE html>
<html>
<head>
  <title>Kutipan di HTML</title>
</head>
<body>
<p>HTML adalah pemrogaman yang harus anda pelajari terlebihi dahulu sebelum anda belajar pemrogaman lain yang digunakan untuk membuat website</p>
<blockquote>
HyperText Markup Language (HTML) is the standard markup language for creating web pages and web applications. 
With Cascading Style Sheets (CSS), and JavaScript, it forms a triad of cornerstone technologies for the World Wide Web
</blockquote>
</body>
</html>

simpan dan lihat hasilnya pada browser kalian

tag blockquote

Perhatikan gambar diatas, terlihat pada gambar diatas ada sebuah kutipan yang secara otomatis akan berpindah garis dan menjorok ke kanan, hal itu dikarenakan kutipan tersebut dibuat dengan menggunakan tag blockquote.

Tag <q>

Setelah membuat sebuah kutipan dengan menggunakan blockquote, selanjutnya kita akan membuat kutipan dengan menggunakan tag <q>. Tag q memiliki fungsi yang hampir sama dengan tag blockqute, hanya ada beberapa perbedaan pada hasil kutipan yang dihasilkan.

Untuk lebih jelasnya perhatikan contoh berikut ini :

<!DOCTYPE html>
<html>
<head>
  <title>Kutipan di HTML</title>
</head>
<ody>
<q>Beri aku 10 Pemuda maka akan kuguncang Dunia</q> - contoh quote
</body>
</html>

simpan dan buka pada browser kalian, maka hasilnya akan seperti ini.

tag q

Setelah kalian lihat gambar diatas, lalu apa perbedaanya dari kutipan yang dibuat menggunakan tag <blockquote>, berikut perbedaannya :

  • tag <q> merupakan versi inline dari tag <blockquote> yang berarti tidak akan berganti baris

  • tidak ada teks yang menjorok, oleh karena itu jika ingin membuat sebuah kutipan yang panjang lebih baik menggunakan tag blockquote

  • teks yang dibuat menggunakan tag <q> akan secara otomatis ditambahkan sebuah tanda petik

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel