Selamat Datang ke Tutorial HTML (asas)

1. Ini adalah asas 1, belajar mengenali tag asas HTML, sila tulis - bukan copy paste, simpan fail ini sebagai index.html

2. Kemudian, kita akan belajar tag untuk menghasilkan tajuk, ada enam saiz untuk menghasilkan tajuk, sila rujuk kod contoh di bawah. Simpan fail ini sebagai asas2.html

3. Seterusnya, buat fail baru bertajuk asas3.html, di sini, kita belajar untuk buat paragraf, bold, italic, strong, dan underline

4. Untuk yang keempat, sila cipta fail asas4.html, kita akan belajar cara untuk buat list/senarai, tag yang perlu kita ingat adalah <ul> dan <li>

5. Untuk buat baris baru, gunakan tag <br/>

6. Dalam tutorial seterusnya, sila buat fail asas6.html, kita akan belajar cara untuk membuat pautan ke website lain menggunakan tag <href>

Uji pautan yang telah dibuat. bagi pautan ke Yahoo itu, ia akan buat satu tetingkap lain pada browser

7. Seterusnya, kita akan belajar cara untuk memasukkan imej ke dalam kod HTML, sila buat file asas7.html dan ikut tutorial dalam gist.

kaedah ini dinamakan Hotlink, iaitu membuat pautan kepada imej dari server lain

8. Buat satu fail bernama asas8.html, kita akan belajar cara untuk membuat table dalam kod html secara asas.

Untuk table yang kompleks, kita akan belajar dalam tutorial yang lain

9. Setiap element HTML boleh diwarnakan. kod warna HTML boleh dirujuk di laman w3shools

Setiap kod warna HTML dimulai dengan tandah hash # ( kod hex)

Dalam tutorial dibawah, kita tukar warna body laman web dengan warna #E6E6FA

10. Kita kembali semula kepada fail index.html

Sekarang kita belajar buat link kepada semua fail yang telah diwujudkan.

Sila upload fail index.html, asas2.html, asas3.html, asas4.html ke dalam server

11. Masih menggunakan fail yang sama, tambah properties target seperti dalam kod snippet

12. Masih menggunakan fail yang sama, kali ini kita gabungkan <ul> , <li > dan<a href>

13. Sekarang buat satu fail lain, eg asas13.html. Gabungkan semua elemen yang telah dipelajari, perhatikan element-element yang telah ditambah.

14. Sediakan beberapa keping gambar.
Sila download gambar bendera bagi setiap daerah di negeri Terengganu

Download Gambar

PERHATIAN: Webserver Linux adalah case sensitive, maksudnya, jika kita tulis kod, mestilah sama dengan nama fail yang ada dalam server, jika nama fail huruf kecil, dalam kod kena huruf kecil

Simpan setiap bendera bermula bendera daerah terengganu dengan nama kualaterengganu.png ( simpan dalam satu folder yang senang untuk dicapai), diikuti dengan daerah yang lain dengan nama daerah masing-masing.

Upload semua imej bendera tadi ke dalam server . pastikan upload imej dalam folder images

Mula tulis kod HTML untuk paparkan image

Tambah row bagi bendera-bendera daerah lain, bila upload ke werbserver, nanti image tidak dapat dipaparkan, sebab fail image tidak diupload. upload fail image ke dalam folder images. ubah sedikit bahagian <img src="kualaterengganu.png"> kepada <img src="images/kualaterengganu.png">

Hasil adalah seperti di bawah

Jika hasil tidak sama seperti dalam gambar, sila resize gambar dengan menggunakan kod seperti dibawah <img src="images/kualaterengganu.png" height="200" width="400">

15. Menggunakan fail dari tutorial 14. Kita akan belajar untuk set tinggi dan lebar pada table. Sila rujuk kod html yang diberikan.

Sukatan matrik bagi panjang dan lebar yang digunakan dalam pembangunan web adalah pixel dan peratus selain itu kita juga ada em dan pt

 sila rujuk http://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/ . Dalam CSS nanti kita akan banyak gunakan pixel, em, pt dan %

16. Buat satu fail asas16.html, kali ini kita akan belajar mengenai table rowspan dan colspan

Tutorial Asas Tamat , Sambung ke Tutorial Pertengahan