Minggu, 31 Maret 2019

Cara Membuat "Daftar Produk" Dengan HTML

Membuat "Daftar Produk" dengan menggunakan script HTML

Nama : Matius Agustinus
Kelas : 12.2A.37
NIM  : 12184094
Tugas 1 Web Programing Membuat Daftar Produk

Hello...
Selamat datang di blog saya Matius Agustinus, di post pertama saya ini, saya akan membagikan cara membuat "daftar produk" dengan menggunakan HTML secara simple/mudah dimengerti.

Oke langsung saja persiapkan aplikasi notepad++/sublime, kalo saya memakai sublime
dan coba kalian tulis di aplikasi kalian seperti script input dibawah ini :



dan disini saya ingin menjelaskan fungsi dari masing-masing tag element diatas :
  • <!DOCTYPE HTML> = Merupakan deklarasi dari type dokumen
  • <html></html> = Dikenal dengan element utama karena semua element berada di dalamnya
  • <head></head> = Element ini berfungsi untuk memasukkan konten yang tidak ingin ditampilkan. Konten tersebut dapat berupa keyword, deskripsi, CSS, dll
  • <title></title> = Merupakan judul dari halaman website yang muncul pada bagian tab browser
  • <body></body> = Berisi konten yang ditampilkan pada browser ketika pengunjung mengakses halaman tersebut, contohnya seperti artikel yang sedang anda baca saat ini
  • <table></table> = Element table digunakan untuk mendefinisikan table
  • <th></th> = Element TH digunakan untuk mendefinisikan judul kolom table
  • <tr></tr> = Element TR digunakan untuk mendefinisikan baris table
  • <td></td> = Element TD digunakan untuk mendefinisikan sel baris table
  • <ul></ul> = Digunakan untuk membuat daftar dengan penanda simbol
  • <li></li> = Adalah untuk menambah daftar/isi dari tag (ul/ol)
  • <img/> = Adalah untuk memasukkan gambar/foto
dari script HTML diatas akan menghasilkan tampilan input sebagai berikut :


Note : 
  1. Perhatikan bahwa setiap tag element memiliki pasangan yakni tag penutupnya yang ditandai format miring atau slash (/), penting atau tidak? format tersebut penting sekali supaya codingan kita tidak berantakan
  2. Bila ingin memasukkan gambar/foto, file image dan file html dalam satu folder
  3. Jika ingin memasukkan gambar/foto, pastikan formatnya ditulis juga di script input. Contoh : foto.jpg/foto.png, sesuai dengan format asli gambar/foto yang akan ditaro di tampilan input
Dan sekian dulu pembelajaran HTML ini, atau lebih tepatnya pembelajaran tentang cara membuat "Daftar Produk",
Kita akan lanjut dilain kesempatan untuk membahas pembelajaran HTML yang lainnya.

Tidak ada komentar:

Posting Komentar