P - 6 Bab 4 : HTML (Hypertext Markup Language) 4.1 Tujuan Mengerti cara membuat table, form & frame HTML. 4.2 Materi 1. Table 2. Form 3. Frame HTML 4.3 Table Tabel terdiri dari beberapa bagian, antara lain : Baris Kolom Bagian-bagian tabel dapat dilihat pada gambar berikut : Baris Kolom Bagian-bagian Tabel Tag yang digunakan untuk membuat table adalah <TABLE> dan diakhiri </TABLE>. Struktur table dalam HTML. PSIK V (Pemrograman II/ PHP MySQL) - 1
Struktur <TABLE> </TABLE> <TD></TD> Keterangan Tag Awal TABLE Baris TABLE Kolom TABLE Tag Penutup Baris Table Tag Penutup TABLE Aligment pada tabel Tabel left, center, right. Baris dan Kolom left, center, right. Atribut tabel Ukuran dapat dilakukan dengan menyesuaikan berdasarkan prosentase atau berdasarkan pixel. Space antar sel menggunakan CELLSPACING Space dalam sel menggunakan CELLPADING Contoh : <HTML> <HEAD> <TITLE>Contoh Table</TITLE> </HEAD> <BODY> Contoh Tabel <BR /> <TABLE BORDER="1" WIDTH="300" BGCOLOR="#FFFCCC" ALIGN="LEFT"> <TD ALIGN="LEFT">Baris 1 Kiri</TD> <TD ALIGN="LEFT">Baris 1 Kanan</TD> <TD ALIGN="CENTER">Baris 2 Kiri</TD> <TD ALIGN="CENTER">Baris 2 Kanan</TD> <TD ALIGN="RIGHT">Baris 3 Kiri</TD> <TD ALIGN="RIGHT">Baris 3 Kanan</TD> <TABLE> </BODY> </HTML> PSIK V (Pemrograman II/ PHP MySQL) - 2
4.4 Form Form merupakan suatu kumpulan yang tediri dari beberapa field dalam suatu halaman. Tag yang digunakan untuk membuat FORM adalah <FORM> dan diakhiri </FORM>. Bagian dari Form adalah sebagai berikut : NAME ACTION METHOD Digunakan untuk mendefinisikan identitas dari suatu Form (Pemberian nama) Tujuan agar Form tersebut mudah dikenali. Digunakan untuk mendefinisikan tujuan Form Merupakan metode yang akan dilakukan setelah Form dikirim. Metode terdiri dari dua bagian : ONSUBMIT POST -> digunakan pada pengiriman Form yang akan disimpan di dalam database. GET -> digunakan untuk mendapatkan hasil dari pengolahan program di server. Merupakan validasi untuk mengecek isi field agar sesuai dengan yang dikehendaki sebelum suatu Form dikirim. Form yang terdapat pada HTML dapat dilihat pada table berikut : Text File Jenis Kode <input type="text" name="name" Value="Your Name"> <input type="password" name="password" Value="****" Size="20"> Text Area <textarea cols="20" rows="5" name="address"> Your Address </textarea> PSIK V (Pemrograman II/ PHP MySQL) - 3
Radio Button Check Boxes <input type="radio" value="1" checked name="opsi"> Opsi A <input type="radio" value="2" checked name="opsi"> Opsi B <input type="checkbox" value="1" name="opsi" checked> Opsi A <input type="checkbox" value="2" name="opsi"> Opsi B Drop Down Menu <p><select name="opsi" size="1"> <option value="1">opsi A</option> <option value="2">opsi B</option> <option value="3">opsi C</option> select></p> Push Button <p><select name="opsi" size="3" Multiple> <option value="1">opsi A</option> <option value="2">opsi B</option> <option value="3">opsi C</option> select></p> <input type="submit" value="submit" name="submit"> <input type="reset" value="reset" name="submit"> PSIK V (Pemrograman II/ PHP MySQL) - 4
Contoh : 4.13 Frame Tag yang digunakan untuk membuat FRAME adalah <FRAME>. Bagian dari FRAME antara lain sebagai berikut : SRC -> Menunjukkan URL SCROLLING (Yes/No) -> pegaturan izin scrolling terhadap halaman. NORESIZE -> pengaturan izin (tidak boleh) melakukan perubahan terhadap ukuran frame. NAME -> pendefinisian nama frame, yang bertujuan untuk memudahkan pendefinisian target. (misalnya frame terbagi menjadi 2 : Frame kanan dan Frame Kiri) TARGET -> pendefinisian tujuan pada frame. Yang didefinisikan menjadi beberapa target : _SELF -> target = frame sama. _TOP -> target = frame yang terletak pada bagian paling atas. _BLANK -> target = membuka tab/jendela baru. _PARENT -> target = sama dengan _TOP. Tag yang digunakan untuk mendefinisikan bahwa suatu halaman web menggunakan FRAME adalah <FRAMESET>. Bagian dari FRAME antara lain : COOLS -> mendefinisikan kolom. ROWS -> mendefinisikan baris. PSIK V (Pemrograman II/ PHP MySQL) - 5
FRAMESPACING -> mendefinisikan jarak antar frame. BORDER -> mendefinisikan batas antar frame. FRAMEBORDER -> mendefinisikan lebar border. PSIK V (Pemrograman II/ PHP MySQL) - 6