The quotesproperti di CSS memungkinkan Anda untuk menentukan jenis kutipan yang digunakan ketika kutipan ditambahkan melalui content: open-quote;atau content: close-quote;aturan. Berikut cara menggunakannya:
q ( quotes: "“" "”" "‘" "’"; ) q::before ( content: open-quote; ) q::after ( content: close-quote; )Dalam contoh di atas, empat nilai ditambahkan. Seperangkat kutipan cerdas ganda dan sepasang kutipan cerdas tunggal. Ini sedikit membingungkan karena setiap kutipan dibungkus dengan tanda kutip - tetapi itu hanya tanda kutip terprogram (bisa ganda (") atau tunggal (')) seperti di mana pun di CSS. Tanda kutip di dalamnya akan digunakan di halaman.
Ada empat nilai untuk properti konten yang berhubungan dengan quotesproperti: open-quote, close-quote, no-open-quote, dan no-close-quote.
Pertama pasangan tanda kutip di nilai adalah pembukaan dan penutupan kutipan. Pasangan kedua adalah kutipan pembukaan dan penutupan untuk kutipan yang bertingkat satu tingkat jauh di dalam kutipan lain yang juga menggunakan quotesproperti. Misalnya elemen di dalam elemen.
Beberapa contoh:
Kutipan ganda pada kutipan pertama, kutipan tunggal pada kutipan kedua.
Kutipan dengan kutipan Prancis.
Anda dapat menempatkan pasangan kutipan di quotesproperti sesuka Anda. Tetapi Anda tidak harus memasukkan lebih dari dua, karena untuk setiap kutipan tambahan itu hanya mengulangi quotesnilai dari awal.
Nilai no-open-quotedan no-close-quotemenghentikan kutipan agar tidak ditampilkan, tetapi nilai dan terus menaikkan kedalaman kutipan.
Informasi Lebih Lanjut
- Jangan gunakan
elemen kecuali Anda mengutip seseorang. Dalam semua kasus lain (ironi, sarkasme, atau apa pun yang Anda gunakan untuk kutipan) cukup gunakan tanda kutip itu sendiri (seperti ini: ""). - Ini bukan hanya untuk
elemennya, tapi bisa jugajuga atau apa pun. - Kutipan & Aksen
Dukungan Browser
| Chrome | Safari | Firefox | Opera | YAITU | Android | iOS |
|---|---|---|---|---|---|---|
| 11+ | Apa saja | 1,5+ | 4+ | 8+ | Apa saja | Apa saja |