Selasa, 14 Februari 2017

Membuat Format Code HTML

Tidak ada komentar
MEMBUAT FORMAT CODE
Format kode digunakan untuk membuat sebuah text dari code komputer. Format code pada HTML ditulis dengan menggunakan tag <code>. Code ini diletakkan dalam tag <body> yang berada dalam dokumen HTML. Web browser akan menampilkan element atau teks yang berada dalam <code> sama dengan tampilan kita menuliskan kode aplikasi kedalam text editor.

Isi dari tag code tidak akan dieksekusi oleh web browser, tetapi ditampilkan dalam bentuk text yang berformat syntax atau kode program.

<code> pada HTML termasuk kelompok inline event element, dan mengikuti alur text yang ada. Umumnya web browser akan menampilkan text yang berada di dalam tag <code> sama dengan jenis font tag <pre>, yakni dengan font monospace, namun dengan perbedaan bahwa tag <code> akan menghapus semua spasi yang lebih dari 1.

Berikut ini adalah contoh penggunaan dari <code>

<!DOCTYPE html>
<html>
<head>
    <title>HTML : FORMAT CODE</title>
</head>
<body>
<p>HTML ---> Ini menggunakan tag paragraf</p>
<p>HTML Adalah singkatan dari <code>Hypertext Markup Lenguage</code></p>
</body>
</html>


Dari contoh diatas dapat kita lihat perbedaan antara <code> dengan <p> . Salah satu perbedaan yang paling menonjol adalah font yang digunakan. Kesimpulanya <code> digunakan dalam penulisan code program dalam halaman web. Salah satu contoh penggunaan <code> dalam aplikasi adalah pembuatan text editor online.

PENGGUNAAN TAG PRE
Tag <pre> adalah singkatan dari Preformatted Text. Sesuai dengan namanya, tag ini digunakan untuk text yang ‘belum’ diformat. Jika text diinput ke dalam tag <pre>, maka HTML akan menampilkan text tersebut sesuai dengan ‘apa adanya’. Text akan ditampilkan sesuai bagaimana text tersebut di buat, termasuk spasi yang ada.

Tag <pre> termasuk ke dalam kelompok block level element, sehingga akan ditampilkan di baris baru, terpisah dari text yang ada sebelum tag ini. Berikut ini adalah contoh penggunaan dari <pre> :

<!DOCTYPE html>
<html>
<head>
<title> Format Code</title>
</head>
<body>
<pre>
<h2> MEMBUAT FORMAT CODE PRE </h2>

Text      ini   
                menggunakan sintag
        pre

</pre>

</body>
</html> 


Dalam penggunaan tag pre maka akan di tampilkan apa adanya dalam script. Dari contoh di atas makan akan terlihat perbedaan dari penggunaan format code <code> dan <pre>. Tag <pre> bersifat Block Element, Sementara <pre> bersifat inline element. Tag <pre> akan menampilkan seluruh element tanpa spasi sementara tag <code> spasi tidak berpengaruh pada tag ini.


REFERENSI
  • www.malesngoding.com

Tidak ada komentar :

Posting Komentar