MATERI: FRAME PADA HTML

Ukuran: px

Mulai penontonan dengan halaman:

Download "MATERI: FRAME PADA HTML"

Sukarno Halim
9 tahun lalu
Tontonan:

1 MATERI: FRAME PADA HTML

2 Frame Digunakan untuk membagi halaman web yang terdiri dari beberapa file html yang saling terintegrasi satu dengan yang lainnya.

3 Struktur Dokumen dalam frame Layout Documents <FRAMESET>. Fungsi : Membagi jendela menjadi beberapa bagian. Content Documents <FRAME SRC= url > Fungsi : Mengisi dari suatu frame, ini merupakan dokumen HTML Struktur Dokumen Menggunakan Frame <HTML> <HEAD> <TITLE> </TITLE> </HEAD> <FRAMESET>. <HTML>

4 Atribut dalam Frameset COL : Membuat Vertical FRAME ROW : Membuat Horizontal FRAME FRAMESPACING : Spasi di sekitar FRAME FRAMEBORDER : Membuat border pada FRAME Contoh : <FRAMESET COLS= 150,150,150 >. <FRAMESET ROWS= 10%,40%,50% >.. <FRAMESET ROWS= *,*,* >.. <FRAMESET COLS= 25%,40%,* >.. <FRAMESET COLS= *,3* >..

5 Atribut dalam Frame SRC MARGIN WIDTH MARGIN HEIGHT SCROLLING NORESIZE FRAMEBORDER Sintaks : 1. <FRAMESET COLS= 15%,25%,*> <FRAME SRC= url > 2. <FRAMESET COLS= 15%,25%,*> <FRAME SRC= url > <FRAME SRC= url > <FRAME SRC= url >

6 Menggunakan Frame kolom <FRAMESET COLS="*,*,*"> <FRAME SRC="file://I:/Latihan HTML/form.htm"> <FRAME SRC="file://I:/Latihan HTML/combo.htm"> <FRAME SRC="file://I:/Latihan HTML/GUESTBOOK.HTM">

7 Menggunakan Frame Baris <FRAMESET ROWS="*,*,*"> <FRAME SRC="file://I:/Latihan HTML/form.htm"> <FRAME SRC="file://I:/Latihan HTML/combo.htm"> <FRAME SRC="file://I:/Latihan HTML/GUESTBOOK.HTM">

8 Menggunakan Frame Baris & Kolom <FRAMESET ROWS="*,*,*"> <FRAMESET COLS="*,*,*"> <FRAME SRC="file://I:/Latihan HTML/form.htm"> <FRAME SRC="file://I:/Latihan HTML/combo.htm"> <FRAME SRC="file://I:/Latihan HTML/GUESTBOOK.HTM"> <FRAME SRC="file://I:/Latihan HTML/combo.htm"> <FRAME SRC="file://I:/Latihan HTML/GUESTBOOK.HTM"> Hasil yang ditampilkan

9 <FRAMESET COLS="*,*"> <FRAMESET ROWS="*,*,*"> <FRAME SRC="file://I:/Latihan HTML/form.htm"> <FRAME SRC="file://I:/Latihan HTML/combo.htm"> <FRAME SRC="file://I:/Latihan HTML/GUESTBOOK.HTM"> <FRAME SRC="file://I:/Latihan HTML/GUESTBOOK.HTM"> Hasil yang ditampilkan

10 Memformat Tampilan Frame 1. Mengatur Margin <html> <head> <title></title> </head> <FRAMESET ROWS="*,*"> <FRAME SRC="file://I:/Latihan HTML/CONTOH.HTML" MARGINHEIGHT=40 MARGINWIDTH=40> <FRAME SRC="file://I:/Latihan HTML/CONTOH.HTML"> </html> Hasil yang ditampilkan

11 <html> <head> <title></title> </head> <FRAMESET ROWS="*,*"> <FRAME SRC="file://I:/Latihan HTML/CONTOH.HTML" MARGINHEIGHT=40 MARGINWIDTH=40 SCROLLING="NO"> <FRAME SRC="file://I:/Latihan HTML/CONTOH.HTML" MARGINHEIGHT=40 MARGINWIDTH=40 SCROLLING="YES"> </html> Hasil yang ditampilkan

12 2. NORESIZE <html> <head> <title></title> </head> <FRAMESET ROWS="*,*"> <FRAME SRC="file://I:/Latihan HTML/CONTOH.HTML" MARGINHEIGHT=40 MARGINWIDTH=40 NORESIZE> <FRAME SRC="file://I:/Latihan HTML/CONTOH.HTML" MARGINHEIGHT=40 MARGINWIDTH=40 NORESIZE> </html> Hasil yang ditampilkan

13 3. FRAMEBORDER <html> <head> <title></title> </head> <FRAMESET ROWS="*,*"> <FRAME SRC="file://I:/Latihan HTML/CONTOH.HTML" MARGINHEIGHT=40 MARGINWIDTH=40 FRAMEBORDER="NO"> <FRAME SRC="file://I:/Latihan HTML/CONTOH.HTML" MARGINHEIGHT=40 MARGINWIDTH=40 FRAMEBORDER="NO"> </html> Hasil yang ditampilkan

14 Link dan Target Pada Frame Induk.html <html> <head> <title></title> </head> <FRAMESET COLS="50%,*"> <FRAME SRC="file://I:/Latihan HTML/index.HTM"> <FRAME NAME="target link" src=""> </html> Hasil dari kedua program diatas Index.html <html> <head> <title></title> </head> <BODY> <H2 ALIGN="center">Link Index</H2> <A HREF="PICTURE1.JPG" TARGET="target link">gambar 1</A><BR> <A HREF="PICTURE2.JPG" TARGET="target link">gambar 2</A><BR> <A HREF="Winter.JPG" TARGET="target link">winter</a><br> <A HREF="Sunset.JPG" TARGET="target link">sunset</a><br> </BODY> </html>

15 Sebelum di klik link Gambar Setelah di klik link Gambar Nilai Atribut Target alternatif adalah : _self Akan menampilkan link target pada frame yang sama _parent Akan menutupi seluruh halaman _top Akan menutupi seluruh halaman _blank Akan membuat jendela baru

16 Floating Frame <html> <head> <title></title> </head> <BODY> <H2 ALIGN="center">Link Index</H2> <A HREF="PICTURE1.JPG" TARGET="target link">gambar 1</A><BR> <A HREF="PICTURE2.JPG" TARGET="target link">gambar 2</A><BR> <IFRAME SRC="FORM.HTM" ALIGN=RIGHT></IFRAME> <A HREF="Winter.JPG" TARGET="target link">winter</a><br> <A HREF="Sunset.JPG" TARGET="target link">sunset</a><br> </BODY> </html> Hasil yang ditampilkan

dokumen-dokumen yang mirip

MS Wulandari - HTML 1

MS Wulandari - HTML 1 PERTEMUAN VII FRAME A. MEMBUAT DAN MENGGUNAKAN FRAME Frame digunakan untuk : Membuat daftar isi pada suatu sisi frame sementara sisi frame yang lain untuk menampilkan isi Membuat