Scribd
Unggah
44 tayangan21 halaman

Form Frame

Form dan frame digunakan untuk membuat halaman web lebih interaktif dan membagi konten. Form digunakan untuk mengumpulkan umpan balik dari pengunjung melalui elemen seperti teks, pilihan, dan checkbox. Frame membagi halaman menjadi bagian-bagian yang dapat diisi konten terpisah seperti halaman utama, form, dan biodata. Kedua fitur ini membantu mendesain halaman web yang lebih dinamis.

Diunggah oleh

Dian Permatasari
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
44 tayangan21 halaman

Form Frame

Form dan frame digunakan untuk membuat halaman web lebih interaktif dan membagi konten. Form digunakan untuk mengumpulkan umpan balik dari pengunjung melalui elemen seperti teks, pilihan, dan checkbox. Frame membagi halaman menjadi bagian-bagian yang dapat diisi konten terpisah seperti halaman utama, form, dan biodata. Kedua fitur ini membantu mendesain halaman web yang lebih dinamis.

Diunggah oleh

Dian Permatasari
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 21

MEMBUAT FORM Dan FRAME

1. Form
• Form adalah suatu cara untuk mejadikan halaman web
menjadi lebih interaktif , karena akan mendaptakan umpan
balik dari pengunjung situs web.
• Form dapat digunakan untuk membuat buku tamu,
formulir pemesanan, survey, meminta komentar dan lain
sebagianya.
MEMBUAT FORM Dan FRAME
 Adapun cara untuk membuat form adalah dengan
menggunakan elemen FORM kemudian
ditambah dengan komponen-komponen
pembentuk form seperti input, checkbox, option
dan sebagainya.
 Perintah untuk membuat form yaitu :

 <FORM [METHOD=”POST/GET”
ACTION=”URL”>
 <INPUT>
 <INPUT>
 </FORM>
MEMBUAT FORM Dan FRAME
2. Method
 Method digunakan untuk menentukan bagaimana
form diberlakukan
 Method digunakan untuk menentukan bagaimana
informasi dikirim ke URL yang disebutkan dalam
action
 Nilai yang umum digunakan berupa GET dan
POST
 POST digunakan untuk membuat informasi dikirim
secara terpisah dengan URL
 GET digunakan membuat informasi dikirim menjadi
satu dengan URL
MEMBUAT FORM Dan FRAME
3. Action
 Action sering diisi dengan URL tempat
pemrosesan form selanjutnya.
 Jika action tidak disebutkan, informasi akan
dikirim ke URL yang sama pada halaman web.
MEMBUAT FORM Dan FRAME
4. Elemen-Elemen Pada Form
MEMBUAT FORM Dan FRAME
MEMBUAT FORM Dan FRAME
 <HTML><HEAD> <TITLE>Contoh Membuat Form</TITLE></HEAD><BODY>
 <H1 ALIGN="CENTER">FORM PENDAFTARAN ONLINE</H1>
 <HR size=3 color="black">
 <FORM METHOD="POST" ACTION="contohform.htm">
 <TABLE>
 <TR> <TD><B>Nama :</B></TD>
 <TD><INPUT TYPE="Text" NAME="varNama" SIZE="15"></TD></TR>
 <TR> <TD><B>Alamat :</B></TD>
 <TD><INPUT TYPE="Text" NAME="varAlamat" SIZE="30"></TD> </TR>
 <TR> <TD><B>Agama :</B></TD>
 <TD><SELECT NAME="agama" SIZE="1">
 <OPTION>Islam</OPTION>
 <OPTION>Kristen</OPTION>
 <OPTION>Budha</OPTION>
 <OPTION>Hindu</OPTION>
 </SELECT> </TD> </TR>
 <TR><TD><B>Password :</B></TD>
 <TD><INPUT TYPE="Password" NAME="varPassword" SIZE="10"></TD> </TR>
 </TABLE>
 <B>Jenis kelamin: </B><INPUT CHECKED TYPE="Radio" NAME="Kelamin" VALUE="Pria">Pria
 <INPUT TYPE="Radio" NAME="Kelamin" VALUE="Wanita">Wanita
 <BR>
 <B>Hobi:</B><BR>
 <INPUT TYPE="Checkbox" NAME="Kelamin" VALUE="Soccer">Sepakbola
 <INPUT CHECKED TYPE="Checkbox" NAME="Hobi" VALUE="Badminton">Bulutangkis
 <INPUT TYPE="Checkbox" NAME="Hobi" VALUE="Computer">Komputer <BR>
 <INPUT TYPE="Checkbox" NAME="Hobi" VALUE="Game">Permainan video
 <INPUT CHECKED TYPE="Checkbox" NAME="Hobi" VALUE="Internet">Internet <BR>
 <B>Komentar</B><BR>
 <TEXTAREA Cols="30" Rows="5" Name="komentar"></TEXTAREA><BR>
 <INPUT TYPE="Submit" VALUE="Send info"> <INPUT TYPE="Reset" VALUE="Clear form">
 </FORM></BODY> </HTML>
MEMBUAT FORM Dan FRAME
 Tampilannya Sebagai Berikut:
MEMBUAT FORM Dan FRAME
5. FRAME
 Frame digunakan untuk membagi suatu halaman
web menjadi beberapa bagian.
 Beberapa bagian tersebut dapat digunakan untuk
berbagai keperluan.
 Adapun cara untuk membuat frame pada halaman
web adalah dengan menggunakan perintah :

 <FRAMESET>
 Atribut Frame
 </FRAMESET>
MEMBUAT FORM Dan FRAME
6. Atribut-Atribut Frame
Atribut fungsi

Menentukan jumlah spasi yang diberikan pada tiap baris. Jumlah


ROWS tersebut dapat berupa pixel, % setelah nilai atau nilai relatif
(*)
COLS Fungsi sama sepert ROWS hanya digunakan untuk kolom.

Menentukan nama frame sehingga dapat berfungsi sebagai


NAME TARGET dari URL lain

SRC Berisi URL yang menjadi sumber dari frame

MARGINWIDTH Untuk menentukan margin frame bagian kanan dan kiri

MARGINHEIGHT Menetukan margin frame bagian atas dan bawah.

Menentukan scrollbar pada frame Diisi dengan YES selalu


SROLLING menampilkan scrollbar, NO tidak menapilkan srollbar

BORDER Mengubah ketebalan pembatas frame

BORDERCOLOR Memberikan warna pada pembatas frame

FRAMEBORDER Pembatas frame. Dapat dihilangkan dengan memberi nilai NO

NORESIZE Mencegah pengguna untuk mengubah ukuran dari frame


MEMBUAT FORM Dan FRAME
 Untuk membuat halaman web yang memiliki frame biasanya akan
dibuat satu halaman web utama yang memiliki frame ditambah
dengan file-file HTML lainnyaYang digunakan sebagai sumber
untuk frame tersebut.
 Berikut akan diberikan contoh penggunaan frame pada suatu
halaman web.

 (Satu.html)
 <html>
 <body bgcolor="#008080">
 <h1 align="center"><font face="Arial">
 Halaman Satu dari File Satu.Html
 </font>
 </h1>
 </body>
 </html>
MEMBUAT FORM Dan FRAME
 (Dua.html)
 <html>
 <body bgcolor="#ff0080">
 <h1 align="center"><font face="Arial">
 Halaman Dua dari File Dua.Htm
 l</font></h1></body></html>

 (Tiga.html)
 <html>
 <body bgcolor="#aa00ff">
 <h1 align="center"><font face="Arial">
 Halaman tiga dari File tiga.Html</font></h1>
 </body>
 </html>
MEMBUAT FORM Dan FRAME
 File dengan framerows :
 <html>
 <frameset rows="80,*">
 <frame src="satu.html" name="atas" scrolling="no" noresize>
 <frame src="dua.html" name="bawah"> </frameset><html>
MEMBUAT FORM Dan FRAME
 File dengan framecols
 <html><frameset cols="200,*">
 <frame src="satu.html" name="kiri" scrolling="no" noresize>
 <frame src="dua.html" name="kanan">
 </frameset><html>
MEMBUAT FORM Dan FRAME
 Contoh gabungan dari framecols dan framerows
 <html>
 <frameset rows=20%,* border=10 bordercolor="red">
 <frame src="satu.html" name="atas" scrolling="no" noresize>
 <frameset cols=30%,*>
 <frame src="dua.html" name="bawah">
 <frame src="tiga.html" name="bawah">
 </frameset><html>
MEMBUAT FORM Dan FRAME
 Sebagai tambahan, file-file sumber dapat dibuat hyperlink ke file-file lain dengan
mengarah ke salah frame yang ada di halaman web tersebut.
 Berikut akan diberikan contoh file yang membuat target ke salah satu frame.

 (judul.html)
 <html>
 <body bgcolor="yellow">
 <h1 align="center">ZUFA’S WEBSIDE</h1></body></html>

 (home.html)
 <HTML>
 <HEAD>
 <TITLE>Membuat Frame- Home</TITLE>
 </HEAD>
 <BODY BGCOLOR="#000ddd">
 <H1 ALIGN=center>Halaman Utama.</H1>
 <p>Selamat datang di homepage saya! Homepage ini pasti menarik dan
 mudah diikuti karena guru saya, selain SANGAT menarik dan menyenangkan, telah mengajarkan
cara yang benar dalam membuat Frame!</P>
 <CENTER><img src="work.gif"><br>Selamat menikmati!</CENTER>
 </BODY> </HTML>
MEMBUAT FORM Dan FRAME
 (Daftar.html)
 <HTML>
 <HEAD>
 <TITLE>Membuat Frame- Daftar</TITLE>
 </HEAD>
 <BODY BGCOLOR="#aaaFFF">
 <H3>---Daftar---</H3>
 <A HREF="home.html" TARGET="bawahkanan">Home</A><P>
 <A HREF="satu.html" TARGET="bawahkanan">Ke File-1</A><BR>atau
 <A HREF="dua.html" TARGET="bawahkanan">ke File-2</A><P>
 atau kunjungi<BR>
 <A HREF=”http://www.unikom.ac.id/” TARGET="_top">UNIKOM
WESITE</A> <BR>
 <A HREF="http://tutorial.pts.co.id/" TARGET="_top">Web
Tutorial</A>
 </BODY>
 </HTML>
MEMBUAT FORM Dan FRAME
 (Master.html atau biasanya bernama Index.html)
 <html>
 <frameset rows=20%,* border=0>
 <noframes>
 maaf hanya bisa tampil pada web yang mendukung frame
 </noframes>
 <frame src="judul.html" name="atas" scrolling="no" noresize>
 <frameset cols=20%,*>
 <frame src="daftar.html" name="bawahkiri" noresize>
 <frame src="home.html" name="bawahkanan">
 </frameset>
 </frameset>
 <html>
MEMBUAT FORM Dan FRAME
 Tampilannya sebagai berikut:
 Tugas:
◦ Buat Folder di C dengan nama : tugas7_nim_kelas
◦ Buatlah halaman web, dengan ketentuan :
 Bagi halaman Web berupa frame baris dan Kolom
 Gunakan Link untuk menuju ke halaman web yang lain
 Gunakan tabel supaya tampilan web anda rapi
 Untuk file web yang lain antara lain : halaman utama, Halaman Form,
Halaman komputer, Halaman Biodata dan Halaman monitor dan halamn
keyboard
MEMBUAT FORM Dan FRAME
 Contoh Tampilannya Seperti berikut:

Anda mungkin juga menyukai