Dokument HTML dibangun oleh empat element utama, yaitu element html, element head, element title, dan element body. Susunan empat element ini di dalam document html biasanya terlihat seperti ini :
<html>
<head>
<title> ... </tittle>
</head>
<body>
...
</body>
<body>
...
</body>
</html>
1. Element root atau Element root
Untuk element yang satu ini Donga rasa sudah cukup jelas di ceritakan pada catatan kita sebelumnya Sturktur HTML. Sedikit untuk mengingat kembali, bahwa element html ini adalah element yang mengandung element-element lain pada suatu dokumen HTML. Jika masih kurang mengerti silahkan buka kembali catatan yang lalu. Semakin sering dibaca catatannya, biasanya akan semakin paham. :)
2. Element Head
Element head ini menurut Donga penting untuk pahami, karena merupakan tempat diletakkannya element tittle. Coba sobat perhatikan, pada tab browser biasanya terdapat sebuah judul. Nah... di element head inilah tempat diletakkannya Text Judul tersebut, tetapi tentunya text tersebut harus sudah dibungkus dengan element tittle.
3. Element Tittle
Merupakan tempat diletakkanya Text Judul yang selanjutnya akan ditampilkan di Tab Browser. Text Judul ini merupakan Content/isi dari element tittle.
4. Element Body
1. Element root atau Element root
Untuk element yang satu ini Donga rasa sudah cukup jelas di ceritakan pada catatan kita sebelumnya Sturktur HTML. Sedikit untuk mengingat kembali, bahwa element html ini adalah element yang mengandung element-element lain pada suatu dokumen HTML. Jika masih kurang mengerti silahkan buka kembali catatan yang lalu. Semakin sering dibaca catatannya, biasanya akan semakin paham. :)
2. Element Head
Element head ini menurut Donga penting untuk pahami, karena merupakan tempat diletakkannya element tittle. Coba sobat perhatikan, pada tab browser biasanya terdapat sebuah judul. Nah... di element head inilah tempat diletakkannya Text Judul tersebut, tetapi tentunya text tersebut harus sudah dibungkus dengan element tittle.
3. Element Tittle
Merupakan tempat diletakkanya Text Judul yang selanjutnya akan ditampilkan di Tab Browser. Text Judul ini merupakan Content/isi dari element tittle.
4. Element Body
Dari seluruh element html hanya content/isi dari element body yang akan ditampilkan di halaman utama browser. Jadi jika kita melihat sebuah tampilan web yang mempesona. Sebagai seorang programer pemula, tentunya kita harus mulai mengarahkan pemikiran ke element body karena disinilah susuna kode-kode tersebut di buat.
Baiklah, sekarang mari kita tinggalkan sebentar catatan di atas, untuk melihat fungsi dari masing-masing element tersebut. Untuk keperluan ini Sobat boleh membuka html editor bisa notepad bawaan windows atau notepad++, untuk Notepad++ jika belum punya boleh sobat download di sini.
Ketik atau Copy code di bawah ini di Notepad/Notepad++
Baiklah, sekarang mari kita tinggalkan sebentar catatan di atas, untuk melihat fungsi dari masing-masing element tersebut. Untuk keperluan ini Sobat boleh membuka html editor bisa notepad bawaan windows atau notepad++, untuk Notepad++ jika belum punya boleh sobat download di sini.
Ketik atau Copy code di bawah ini di Notepad/Notepad++
<html>
<head>
<title>4 Element HTML</title>
</head>
<body>
4 Element HTML Yang Harus Dipahami Seorang Pemula
</body>
<body>
4 Element HTML Yang Harus Dipahami Seorang Pemula
</body>
</html>
Gambar 1.Kode pada Notepad++
kemudian simpan dengan nama basic.html.
Gambar 2. Simpan dengan nama basic.html
Langkah berikutnya silahkan Sobat buka menggunakan browser kesayangan sobat Mozilla Firefox atau Chrome. Jika langkah yang dilakukan benar, maka tampilannya akan terlihat seperti ini :
Gambar 3. Tampilan kode setelah dijalankan di browser
Keterangan :
Pada Gambar 3. dapat kita perhatikan bahwa element title ditampilkan pada tab window, sedangkan element body ditampilkan pada halaman utama browser.
Donga rasa cukup sekian dulu catatan hari ini. Untuk pengembangan silahkan sobat otak-atik sendiri kodenya. Misalnya Sobat mau melihat efek dari masing-masing element html jika dihilangkan (tidak ditulis) apa yang akan terjadi pada tampilan web. Sampai jumpa di catatan selanjutnya.
kemudian simpan dengan nama basic.html.
Langkah berikutnya silahkan Sobat buka menggunakan browser kesayangan sobat Mozilla Firefox atau Chrome. Jika langkah yang dilakukan benar, maka tampilannya akan terlihat seperti ini :
Keterangan :
Pada Gambar 3. dapat kita perhatikan bahwa element title ditampilkan pada tab window, sedangkan element body ditampilkan pada halaman utama browser.
Donga rasa cukup sekian dulu catatan hari ini. Untuk pengembangan silahkan sobat otak-atik sendiri kodenya. Misalnya Sobat mau melihat efek dari masing-masing element html jika dihilangkan (tidak ditulis) apa yang akan terjadi pada tampilan web. Sampai jumpa di catatan selanjutnya.
Tidak ada komentar:
Tulis komentar