Pengenalan kepada HTML

Pengajaran 1-1

Ringkasan Pengajaran

Kita akan mempelajari ciri-ciri asas sebuah laman web, dan  cara meletakkan teks, imej dan juga pautan pada sebuah laman web!

ASK Tingkatan 1

4.2.2 Menggunakan tags dalam atur cara HTML <head>; <title>; <body> dan <paragraph>

4.2.3 Mengguna paragraph headings dalam atur cara HTML yang dibina

4.2.5 Membina pautan teks dan imej dalam atur cara HTML

4.2.6 Menulis atur cara untuk memasukkan imej dalam atur cara HTML.

4.2.7 Menghasilkan pull down menu melalui atur cara HTML.

4.2.8 Menghasilkan ruang komen melalui atur cara HTML.

SK Tingkatan 5

3.3.5 Menggunakan Bahasa Penskripan Klien untuk membina laman web penggun yang interaktif mengandungi fitur berikut: (i) Pengesahan data(ii) Butang pilihan 

Tahukah anda? Selain Facebook dan Instagram, laman web juga boleh dijadikan sebagai ruang media sosial.

Laman web boleh dibina untuk tujuan bisnes atau kegunaan peribadi.

Mari kita memahami asas pembinaan web iaitu kod arahan HTML! 

Tonton video dengan teliti

Cuba sendiri pada paparan Repl.it!

Ikut langkah-langkah yang diberikan di bawah untuk mencuba penggunaan tag dalam pembinaan laman web.

Langkah 1: Baris 9 - Taipkan “Ini adalah laman web David Chak” di antara tag awal <p> dan tag akhir </p>

Langkah 2: Baris 10 - Bina satu ruang perenggan menggunakan tag <p>. Isikan ruang perenggan ini dengan teks “Saya adalah murid Tingkatan 3 daripada SMK Arus”. 

Langkah 3: Klik pada butang Run.

Langkah 4: Perhatikan apa yang berlaku pada paparan web pelayar di bawah.

Tag dalam HTML

Ini merupakan struktur paling asas dalam sesuatu dokumen HTML. Sesuatu dokumen HTML mesti mula dengan tag <html> dan akhiri dengan tag </html>

Kandungan HTML yang paling asas akan mengandungi dua bahagian, iaitu bahagian head dan bahagian body

Head

Body

Semua kod HTML akan terkandung dalam bahagian <body>. Ini merupakan bahagian utama sesuatu dokumen HTML. 

Kod HTML yang di luar tag <body> tidak akan dipaparkan dalam pelayar web

Salah satu tag yang biasa digunakan ialah tag <p>. Tag <p> bermaksud perenggan (paragraph). Kandungan teks boleh diletakkan dalam tag <p> untuk dipaparkan pada laman web. 

Tip Tambahan

Sebuah elemen merujuk kepada sebuah item daripada tag awal hingga ke tag akhir. 

Dalam sebuah elemen, terdapat atribut dan juga nilai atribut yang boleh disertakan.

Contoh paparan pada kod di atas:

Hello, semua!

Google