F R A M E

(1)

KOMPUTER APLIKASI IT – 1 U N I K O M

2 0 1 1

(2)

P E N G A N T A R

 Frame HTML dapat digunakan untuk membuat tampilan halaman HTML yang terbagi dalam beberapa bagian, dan dan masing-masing bagian terdiri dari dokumen HTML tersendiri.

 Biasanya frame digunakan jika salah satu bagian

dalam halaman web tetap dan halaman yang

lainnya berubah (misalnya menu) sehingga

dapat mempercepat proses eksekusi, karena

hanya satu bagian saja yang di-load dari server.

(3)

B E N T U K F R A M E

• Di Internet mungkin kita pernah menjumpai sebuah situs yang berisikan banyak informasi, tetapi setiap kita akses melalui tombol tertentu informasi dapat dilihat dihalaman tersebut tanpa berpindah atau menutup halaman itu sendiri. Apabila yang terjadi demikian, mungkin salah satunya menggunakan teknik frame ini.

• Frame memungkinkan satu halaman web atau lebih bisa ditampilkan pada sebuah jendela browser saja.

Bentuk dasar frame bisa berupa kolom dan baris.

(4)

B E N T U K F R A M E

(5)

CONTOH PROGRAM framecols.html

1. <html>

2. <head>

3. <title>framecols</title>

4. </head>

5. <frameset cols ="20%,*">

6. <frame name="fkiri" src="fkiri.html">

7. <frame name="fkanan" src="fkanan.html">

8. </frameset>

9. </html>

(6)

CONTOH PROGRAM fkiri.html

1. <html>

2. <head>

3. <title>framecols</title>

4. </head>

5. <BODY>

6. <CENTER>

7. <H3>Frame Kiri</H3>

8. <HR>

9. Ini adalah frame kiri

10. …… …… …… …… …… …… …… ……

11. …… …… …… …… …… …… …… ……

12. …… …… …… …… …… …… …… ……

13. </CENTER>

14. </BODY>

15. </html>

(7)

CONTOH PROGRAM fkanan.html

1. <html>

2. <head>

3. <title>framecols</title>

4. <head>

5. <BODY>

6. <CENTER>

7. <H3>Frame Kanan</H3>

8. <HR>

9. Ini adalah frame kanan

10. …… …… …… …… …… …… …… ……

12. …… …… …… …… …… …… …… ……

13. </CENTER>

14.</BODY>

15.<html>

(8)

Untuk membuat frame dalam bentuk kolom, gunakan tag

<frameset> dan berikan atribut

cols serta berikan nilai pada

atribut cols tersebut.

(9)

CONTOH PROGRAM framerows.html

1. <html>

2. <head>

3. <title>framecols</title>

4. </head>

5. <frameset rows ="20%, *">

6. <frame name="fatas" src="fAtas.html">

7. <frame name="fbawah" src="fBawah.html">

8. </frameset>

9. </html>

(10)

CONTOH PROGRAM FAtas.html

1. <html>

2. <head>

3. <title>.: frame rows :.</title>

4. </head>

5. <BODY>

6. <CENTER>

7. <H3>Frame Atas</H3>

8. <HR>

9. Ini adalah frame Atas

13. </CENTER>

14.</BODY>

15.</html>

(11)

CONTOH PROGRAM FBawah.html

1. <html>

2. <head>

3. <title>framerows</title>

4. <head>

5. <BODY>

6. <CENTER>

7. <H3>Frame Bawah</H3>

8. <HR>

9. Ini adalah frame Bawah

13. </CENTER>

14.</BODY>

15.<html>

(12)

G A B U N G A N F R A M E

FrameGabungan.html

1. <html>

2. <head>

3. <title>framerows</title>

4. </head>

5. <frameset rows ="20%,*">

6. <frame name="fkanan" src="fatas.html">

7. <frame name="fkiri" src="framecols.html">

8. </frameset>

9. </html>

(13)

Border Pada Frame

 Border merupakan pemisah antar frame yang satu dengan yang lainya.Untuk memberikan border dan menghilangkan border, Atribut yang digunakan adalah <border>.

Apabila tidak memberikan atribut border, artinya frame yang dibuat secara otomatis muncul adanya border hal ini dianggap border = ”1”.

 Sedangkan apabila tidak menghendaki adanya pemisah antarframe, tambahkan border = “0”

pada tag <frameset>.

(14)

G A B U N G A N F R A M E

FrameGabungan.html

1. <html>

2. <head>

3. <title>framerows</title>

4. </head>

5. <frameset rows ="20%,*“ border = 0>

6. <frame name="fkanan" src="fatas.html">

7. <frame name="fkiri" src="framecols.html">

8. </frameset>

9. </html>

(15)

Scrolling Pada Frame

Scrolling merupakan tombol

penggulung yang muncul secara

otomatis apabila informasi yang ada

terlalu panjang untuk dapat ditampilkan

dilayar. Keberadaan scrolling pada

frame bisa dihilangkan. Caranya pada

frame tersebut, anda bisa

menambahkan, SCROLLING = “No”.

(16)

G A B U N G A N F R A M E

FrameGabungan.html

1. <html>

2. <head>

3. <title>framerows</title>

4. </head>

5. <frameset rows ="20%,*“ border = 0>

6. <frame name="fkanan" src="fatas.html”

scrolling="no">

7. <frame name="fkiri" src="framecols.html">

8. </frameset>

9. </html>

(17)

F R A M E - UNIKOM Kuliah Online

F R A M E

KOMPUTER APLIKASI IT – 1 U N I K O M

2 0 1 1

P E N G A N T A R

 Frame HTML dapat digunakan untuk membuat tampilan halaman HTML yang terbagi dalam beberapa bagian, dan dan masing-masing bagian terdiri dari dokumen HTML tersendiri.

 Biasanya frame digunakan jika salah satu bagian

dalam halaman web tetap dan halaman yang

lainnya berubah (misalnya menu) sehingga

dapat mempercepat proses eksekusi, karena

hanya satu bagian saja yang di-load dari server.

B E N T U K F R A M E

• Frame memungkinkan satu halaman web atau lebih bisa ditampilkan pada sebuah jendela browser saja.

Bentuk dasar frame bisa berupa kolom dan baris.

B E N T U K F R A M E

CONTOH PROGRAM framecols.html

1. <html>

2. <head>

3. <title>framecols</title>

4. </head>

5. <frameset cols ="20%,*">

6. <frame name="fkiri" src="fkiri.html">

7. <frame name="fkanan" src="fkanan.html">

8. </frameset>

9. </html>

CONTOH PROGRAM fkiri.html

1. <html>

2. <head>

3. <title>framecols</title>

4. </head>

5. <BODY>

6. <CENTER>

7. <H3>Frame Kiri</H3>

8. <HR>

9. Ini adalah frame kiri

10. <BR>……<BR>……<BR>……<BR>……<BR>……<BR>……<BR>……<BR>……

11. <BR>……<BR>……<BR>……<BR>……<BR>……<BR>……<BR>……<BR>……

12. <BR>……<BR>…… <BR>……<BR>……<BR>……<BR>……<BR>……<BR>……

13. </CENTER>

14. </BODY>

15. </html>

CONTOH PROGRAM fkanan.html

Untuk membuat frame dalam bentuk kolom, gunakan tag

<frameset> dan berikan atribut

cols serta berikan nilai pada

atribut cols tersebut.

CONTOH PROGRAM framerows.html

1. <html>

2. <head>

3. <title>framecols</title>

4. </head>

5. <frameset rows ="20%, *">

6. <frame name="fatas" src="fAtas.html">

7. <frame name="fbawah" src="fBawah.html">

8. </frameset>

9. </html>

CONTOH PROGRAM FAtas.html

CONTOH PROGRAM FBawah.html

G A B U N G A N F R A M E

FrameGabungan.html

1. <html>

2. <head>

3. <title>framerows</title>

4. </head>

5. <frameset rows ="20%,*">

6. <frame name="fkanan" src="fatas.html">

7. <frame name="fkiri" src="framecols.html">

8. </frameset>

9. </html>

Border Pada Frame

 Border merupakan pemisah antar frame yang satu dengan yang lainya.Untuk memberikan border dan menghilangkan border, Atribut yang digunakan adalah <border>.

Apabila tidak memberikan atribut border, artinya frame yang dibuat secara otomatis muncul adanya border hal ini dianggap border = ”1”.

 Sedangkan apabila tidak menghendaki adanya pemisah antarframe, tambahkan border = “0”

pada tag <frameset>.

G A B U N G A N F R A M E

FrameGabungan.html

1. <html>

2. <head>

3. <title>framerows</title>

4. </head>