Sebelum kita masuk ke pembahasanya, ada yang perlu saya sampaikan terlebih dahulu, bahwa semua "Konten" dalam tampilan sebuah website itu harus dibungkus dengan Tag-tag HTML. Walaupun mungkin ada kasus dimana untuk menampilkan "Konten" itu tidak memerlukan Tag HTML, tapi itu adalah penulisan yang salah.
#Catatan : semua kode tampilan website, harus ditulis didalam tag <body>
Sekarang kita lihat saja contoh kasusnya, jika di dalam tag body, saya hanya menuliskan konten yang isi nya "Ini adalah penulisan yang salah" maka bisa saja menulis nya seperti ini :
<!DOCTYPE html>
<html>
<head>
<head>
<body>
Ini adalah penulisan yang salah
</body>
</html>
Maka tulisan "ini adalah penulisan yang salah" akan ditampilkan di browser, tapi seperti yang saya jelaskan tadi bahwa itu adalah penulisan yang salah. Karna HTML-nya tidak mengenali tulisan "ini adalah penulisan yang salah" mempunyai arti apa?
Untuk lebih lanjutnya kita langsung ke pembahasanya, dan kali ini kita akan memulai untuk mempelajari Paragraf dan Heading, apa kegunaanya dari tag kedua nya dan bagaimana menulisnya.
1. Paragraf
Element paragraf atau tag paragraf itu akan mengartikan bahwa konten di dalamnya adalah sebuah paragraf, baik paragraf itu satu kata, dua kata, atau sampai berbaris-baris. Untuk menulisnya cukup simpel, yaitu dengan menuliskan tag <p>, dan tentu saja dengan tag penutupnya </p>. Contoh :
<p>Ini adalah sebuah paragraf </p>
#Catatan : dalam penulisan kode HTML ini, spasi tambahan atau enter (menambah garis baru ) itu tidak akan di tampilkan di browser, itulah sifat bahasa HTML. Contohnya :
<p>Ini adalah sebuah paragraf </p>
<p>
Ini adalah
paragraf yang lain
dengan menambahkan
enter
</p>
Maka browser akan menghapus semua tambah itu, dan akan diubah menjadi teks yang normal, tanpa ada spasi yang berlebihan dan enter. Lalu bagaimana jika kita ingin paragraf yang berada di garis baru? Kita bisa menggunakan tag <br> tanpa tag penutupnya.
<p> Ini adalah paragraf <br> dengan garis baru</p>
2. Heading
Tag heading akan di artikan sebagai "Judul". Jika kita melihat website-website, maka ada sebuah "Judul" dari postingan, yang paling mencolok dan menarik perhatian bagi orang yang melihat website itu.
Tag heading dapat ditulis dengan tag <h1> sampai tag <h6>, bisa di artikan bahwa tag <h1> itu merupakan "Judul Utama-nya" dan tag <h2> sampai <h6> adalah "Sub Judul-nya". Contoh penulisanya :
Tag heading akan di artikan sebagai "Judul". Jika kita melihat website-website, maka ada sebuah "Judul" dari postingan, yang paling mencolok dan menarik perhatian bagi orang yang melihat website itu.
Tag heading dapat ditulis dengan tag <h1> sampai tag <h6>, bisa di artikan bahwa tag <h1> itu merupakan "Judul Utama-nya" dan tag <h2> sampai <h6> adalah "Sub Judul-nya". Contoh penulisanya :
<h1>Ini adalah heading</h1>
<h2>Ini adalah heading</h2>
<h3>Ini adalah heading</h3>
<h4>Ini adalah heading</h4>
<h5>Ini adalah heading</h5>
<h5>Ini adalah heading</h6>
<h2>Ini adalah heading</h2>
<h3>Ini adalah heading</h3>
<h4>Ini adalah heading</h4>
<h5>Ini adalah heading</h5>
<h5>Ini adalah heading</h6>
Jika kita lihat tampilannya di browser, maka ukuran tag <h1> yang paling besar ukuranya, dan tag selanjutnya akan lebih kecil dan sampai ke tag <h6> yang ukuranya paling kecil. Itu adalah ukuran default yang ada pada HTML, namun kita juga merubah sesuai keinginan kita.
Untuk tambahanya, ada satu tag HTML yang berhubungan tag Heading ini, yaitu tag <hr> yang mempunya arti "Horizontal Rule" dalam bahasa indonesia bisa di artikan "Garis Horizonal". Tag <hr> ini biasa nya dipakai untuk memisahkan Judul dengan Konten-nya, di tulis setelah tag <h1> baru kemudian tag <p> sebagai pembungkus Kontenya.
Sekian untuk tutorial kali ini --
Untuk tambahanya, ada satu tag HTML yang berhubungan tag Heading ini, yaitu tag <hr> yang mempunya arti "Horizontal Rule" dalam bahasa indonesia bisa di artikan "Garis Horizonal". Tag <hr> ini biasa nya dipakai untuk memisahkan Judul dengan Konten-nya, di tulis setelah tag <h1> baru kemudian tag <p> sebagai pembungkus Kontenya.
<h1>Ini adalah Judul</h1>
<hr>
<p>Ini dalah kontennya</p>
<hr>
<p>Ini dalah kontennya</p>
Sekian untuk tutorial kali ini --
No comments:
Write Post a Comment