Bahagian-III

Asas Bahasa HTML - I

Kod html asas

Sebagai permulaan kita akan membincangkan kod-kod asas html. Di bawah ini merupakan kod-kod html yang paling ringkas.

-mula----------------------------------
<html>
       <head></head>
       <body>
         Ini adalah laman pertama saya.
       </body>
</html>
-tamat----------------------------------

Kod-kod html terdiri daripada tag-tag. Setiap yang terkandung dalam huruf '<' dan '>' dinamakan tag. Dalam contoh di atas anda telah diperkenalkan dengan tag.

<html> dan </html>
<head> dan </head>
<body> dan </body>

Permulaan tag diletakkan dengan <namatag> dan penutup tag diletakkankan dengan </namatag>. Perhatikan tanda '/' yang berada di depan nama penutup tag. Tag-tag ini perlu wujud kerana ia menunjukkan bahawa dokumen itu adalah dokumen html dan boleh dibaca oleh browser HTML anda. Untuk menggunakan contoh di atas.

Sekarang,

Buat pilihan pada kod-kod di atas dan tekan CTRL-C (Copy).
Buka Windows Notepad anda.
Aktifkan tetingkap Notepad anda, tekan Ctrl-V (Paste).
Simpan fail itu dengan nama html1.htm di dalam direktori/folder homepage yang anda telah buat. Jika anda pengguna Windows 95 / Windows 98. Ada beberapa langkah tambahan yang patut anda lakukan semasa menamakan fail html1.htm.
Buka Windows Explorer. Dwi-klik pada fail html1.htm.

Tag-tag ini tidak akan dipaparkan oleh browser html anda, sebaliknya ia diterjemahkan oleh html browser anda. Sekiranya anda ada membuat sebarang perubahan dengan isi kandungan fail html di dalam tetingkap notepad, dan pada ketika itu browser html anda telah aktif dengan fail html anda dipaparkan. Anda bolehlah menekan butang Refresh untuk melihat perubahan yang terkini. Lihat contoh.

Mengapa perlu pembuka dan penutup tag?

Untuk menjawab soalan itu anda lihat contoh kedua.

-mula----------------------------------
<html>
       <head></head>
       <body>
         <b>Ini adalah</b> laman <i>pertama</i> saya.
       </body>
</html>
-tamat----------------------------------

Simpan fail di atas dengan nama html2.htm. Apabila anda melihat dokumen ini dengan menggunakan browser HTML anda. Terdapat 2 perubahan iaitu perkataan "Ini adalah" telah digelapkan (bold) dan perkataan "pertama" telah disendengkan (italics). Ini berlaku kerana perkataan "Ini adalah" tersebut berada di antara tag dan ( untuk bold) dan perkataan "pertama" berada di antara tag dan ( untuk italics).

Saya mahukan perkataan itu digelapkan dan disendengkan serentak.

Untuk menjawab soalan itu anda lihat contoh ketiga.

-mula----------------------------------
<html>
       <head></head>
       <body>
                   <b><i>Ini adalah laman utama saya</i></b>
       </body>
</html>
-tamat----------------------------------

Simpan fail di atas dengan nama html4.htm.

Apa gunanya tag head?

Untuk menjawab soalan berikut anda lihat contoh keempat.

-mula----------------------------------
<html>
       <head>
                   <title> Laman Peribadi saya </title>
       </head>
       <body>
                   <b>Ini adalah</b> laman <i>pertama</i> saya.
       </body>
</html>
-tamat----------------------------------

Simpan fail di atas dengan nama html4.htm. Apabila anda melihat dokumen ini dengan menggunakan browser HTML anda. Anda mungkin tidak melihat sebarang perubahan. Tetapi jika anda teliti, perkataan "Laman peribadi saya" akan kelihatan pada title bar browser html anda. Ini gunanya tag <head>, di antara tag <head> ini anda letakkan tag-tag yang mempunyai fungsi khas. Terdapat banyak lagi fungsi-fungsi khas yang akan anda pelajari kemudian.

Anak panah menunjukkan title bar