Tutorial Text HTML Part 8: Cara Membuat Text HTML Tanpa Format (tag pre dan tag code)

Di pada HTML, bagi menampilkan text agar dapat tampil dengan spasi dan karakter sesuai aslinya (text tanpa format) kita memerlukan tag khusus, yakni tag <pre>. Sekiranya di pada tag lazimnya, HTML akan menyampingkan spasi antar karakter (apabila terdapat lebih dari 1 spasi secara berurutan), text yang berada di pada tag <pre> akan ditampilkan dengan ‘apa adanya’.

Di panduan Text HTML kali ini kita akan membahas mengenai Cara Membuat Text HTML Tanpa Format dengan menggunakan tag <pre> dan tag <code>.


Tag <pre> Bagi Membangun Preformatted Text HTML

Tag <pre> ialah singkatan dari Preformatted Text. Sesuai dengan namanya, tag ini digunakan bagi text yang ‘belum’ diformat. Sekiranya text diinput ke pada tag <pre>, karenanya HTML akan menampilkan text tersebut sesuai dengan ‘apa adanya’. Text akan ditampilkan sesuai bagaimana text tersebut di bikin, termasuk spasi yang terdapat.

Tag <pre> termasuk ke pada kelompok block level element, sehingga akan ditampilkan di baris baru, terpisah dari text yang terdapat sebelum tag ini.

Berikut ialah contoh cara penulisan dan pemakaian tag <pre> di pada HTML:

 Seperti yang terlihat, spasi akan tetap ditampilkan dari yang yang ditulis. Pun jenis font yang digunakan biasanya font berjenis “monospace” yang mempunyai panjang karakter yang sama bagi setiap hurufnya.

Tag <pre> pun sering dimanfaatkan bagi merancang contoh program. Seluruh contoh kode program di Source Code Program ini ditampilkan di pada tag <pre>. akan tetapi kita mesti mengkonversi karakter “<” dan “>” menjadi karakter HTML Entity. Lebih lanjut dapat ke: Cara Menampilkan dan Memasukkan Karakter Khusus ke dalam HTML.


Tag <code> bagi Penulisan Kode

Sesuai dengan namanya, tag <code> diperuntukkan bagi memasukkan kode ke pada HTML. Umumnya web browser akan menampilkan text yang berada di pada tag <code> sama dengan jenis font tag <pre>, yakni dengan font monospace, namun dengan perbedaan bahwa tag <code> akan menghapus seluruh spasi yang lebih dari 1.

Tag <code> termasuk kelompok inline level element, dan mengikuti alur text yang terdapat.

Berikut ialah contoh cara penulisan dan pemakaian tag <code> di pada HTML:

Dari contoh dapat dilihat perbedaan dari tag <pre> dan tag <code>. Tag <pre> bersifat block faktor, sedangkan tag <code> bersifat inline faktor. Tag <pre> akan menampilkan seluruh text tanpa menformat spasi, namun di pada tag <code>, jikalau ditemukan karakter spasi dengan jumlah lebih dari 1, karenanya hanya 1 yang digunakan.

Selain menggunakan tag <pre> dan tag <code>, HTML versi 4.01 mempunyai tag <tt> yang akan menghasilkan tampilan yang sama dengan tag <code>. Tag <tt> ad
alah singkatan dari Teletype, dan akan ditampilkan dengan font “monospace”.

HTML5 menyatakan tag <tt>: deprecated, yang artinya disarankan bagi tak digunakan, dan kemungkinan tak akan didukung web browser. Sahabat mungkin masing menemukan tag ini terutama pada blog lama.


Sumber https://www.duniailkom.com/

Share

You may also like...