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:
|
1 |
<!DOCTYPE html><br/><html><br/><head><br/><title>Belajar HTML di Source Code Program</title><br/></head><br/><br/><body><br/><h3>Saya sedang belajar HTML di Source Code Program.com</h3><br/><pre><br/>Spasi di pada bagian <br/><br/>ini akan ditampilkan<br/> <br/>dengan apa adanya<br/> <br/></pre><br/></body><br/><br/></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:
|
1 |
<!DOCTYPE html><br/><html><br/><head><br/><title>Belajar HTML di Source Code Program</title><br/></head><br/><br/><body><br/><h3>Saya sedang belajar HTML di Source Code Program.com</h3><br/><p>HTML ialah singkatan dari <br/><code>Hypertext Markup Language</code></p><br/></body><br/><br/></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.
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/
