Pada bahagian I, saya telah berkongsi apa itu HTML dan bagaimana ia dibina serba sedikit. Bagi yang terlepas contoh kod yang telah saya kongsikan, boleh lihat di sini.

https://thepatriots.asia/archives/4324

Kali ini saya akan berkongsikan bagaimana ingin mengubah kod pada borang yang telah saya kongsikan kepada yang lebih kemas dan juga bagaimana gambar serta pautan untuk dimasukkan ke dalam HTML.

Table

Untuk melihat kedudukan form itu dalam keadaan kemas, kita boleh memasukkan kod <table> sebagai permulaan dan </table> untuk penutupnya. Di dalam table akan ada <tr> atau dipanggil sebagai table row manakala <th> adalah row heading. Seperti biasa, setiap permulaan label perlu ada penutupnya dengan hanya menambah </tr> dan </th>. Row heading adalah dikhaskan sebagai tajuk kepada data yang ingin kita tujukan. Untuk data pula, labelnya adalah <td> bagi permulaan dan </td> penutupnya. Saya sertakan contoh bagaimana form dikemaskan dengan menggunakan cara table.

Contoh borang yang dikemas kini dengan menggunakan borang

Dalam sesebuah jadual atau table, ia boleh mempunyai dua lajur atau lebih. Sebagai contoh, dalam sesebuah jadual, kita ingin masukkan lebih daripada 2 lajur. Kita hanya perlu masukkan kod colspan. Jika untuk baris pula, kita hanya perlu masukkan rowspan. Contohnya:

Contoh
Hasilnya

Gambar, Pautan dan Gambar besertakan Pautan

Untuk gambar, label yang harus diletakkan adalah <img> besertakan src sebagai sifat atau attribute di dalam label <img>. Src digunakan untuk memanggil pautan secara atas talian ataupun memanggil gambar daripada fail yang disimpan pada window. Contohnya:

Contoh kod dan hasil yang dikeluar

Bagi pautan pula, caranya agak mudah. Anda hanya perlu menggunakan label anchor serta href untuk memanggil pautan tersebut. Contohnya,

<a href=”http://www.google.com.my/”> Cuba tekan pada pautan ini </a>

Jika ingin memasukkan pautan pada gambar, anda hanya perlu gabungkan kod gambar dan juga kod pautan. Contohnya,

<a href=”http://www.google.com.my/” <img src=”https://media.licdn.com/media/p/7/005/04e/208/147c6ed.png“> </a>

Lihat hasilnya dengan simpan ke dalam notepad dan jangan terlupa .html.

Jika anda ingin tahu, setiap elemen HTML mempunyai 2 jenis nilai paparan yang mungkir. Kebanyakannya elemen tersebut ialah :

Elemen pada tahap blok

  • Sentiasa dimulakan dengan baris yang baru
  • Digunakan sebagai bekas untuk mengisi elemen-elemen HTML
  • Contohnya,
    • <div></div>
    • <p></p>
    • <form></form>

Elemen dalam barisan

  • tidak digunakan pada baris yang bari
  • contohnya,
    • <img />
    • <a> </a>

Sebagai seorang programmer, HTML adalah lebih kepada scripting manakala Javascript pula bahasa pengaturcaraan untuk membina sesebuah laman sesawang. Bagi pemprosesan HTML ia memerlukan back-end. Back-end biasanya menggunakan bahasa pengaturcaraan PHP. Dari segi penyimpanan data pula lain caranya. Jadi, setakat ini perkongsian yang saya dapat kongsikan bersama. Jika anda ingin mempelajari lebih lanjut, anda boleh melayari laman sesawang https://www.w3schools.com

-MAF

 


Perhatian sebentar…

Sejak 2012, kami bersungguh menyediakan bacaan digital secara percuma di laman ini dan akan terus mengadakannya selaras dengan misi kami memandaikan anak bangsa.

Namun menyediakan bacaan secara percuma memerlukan perbelanjaan tinggi yang berterusan dan kami sangat mengalu-alukan anda untuk terus menyokong perjuangan kami.

Tidak seperti yang lain, The Patriots tidak dimiliki oleh jutawan mahupun politikus, maka kandungan yang dihasilkan sentiasa bebas dari pengaruh politik dan komersial. Ini mendorong kami untuk terus mencari kebenaran tanpa rasa takut supaya nikmat ilmu dapat dikongsi bersama.

Kini, kami amat memerlukan sokongan anda walaupun kami faham tidak semua orang mampu untuk membayar kandungan. Tetapi dengan sokongan anda, sedikit sebanyak dapat membantu perbelanjaan kami dalam meluaskan lagi bacaan percuma yang bermanfaat untuk tahun 2024 ini dan seterusnya. Meskipun anda mungkin tidak mampu, kami tetap mengalu-alukan anda sebagai pembaca.

Sokong The Patriots dari serendah RM2.00, dan ia hanya mengambil masa seminit sahaja. Jika anda berkemampuan lebih, mohon pertimbangkan untuk menyokong kami dengan jumlah yang disediakan. Terima kasih. Moving forward as one.

Pilih jumlah sumbangan yang ingin diberikan di bawah.

RM2 / RM5 / RM10 / RM50

Terima kasih


Share.

Nama penuh : Muhd Ammerul Faizal, Nama pena : MAF, Negeri kelahiran : Johor, Sedang menuntut di Universiti Teknikal Malaysia Melaka (UTeM). Mengambil jurusan IT dalam bidang Pembangunan perisian, Minat ke arah Zoologist (Haiwan purba dan Haiwan Istimewa).

Leave A Reply