Friday, November 20, 2009

HTML Frame


MATERI:

Element FRAMESET, Element FRAME, Element NOFRAMES





ELEMENT FRAMESET

Element FRAMESET berfungsi untuk membagi isi jendela web browser menjadi beberapa bagian. Element ini mempunyai attribute yaitu  cols (membagi jendela berdasarkan kolom), rows (membagi jendela berdasarkan baris), border , bordercolor, frameborder (untuk menampilkan border frame), dan framespacing (spasi antara frame). Element FRAMESET terletak di antara element HEAD dan BODY.



Sintaks:

<frameset

     cols="list"

     rows="list"

     border="pixel"

     bordercolor="color"

     frameborder="yes"|"no"

     framespacing="pixel">

   ...........................

</frameset>





ELEMENT FRAME

Element FRAME  mendefinisikan frame yang terdapat dalam frameset. Element ini mempunyai attribute yaitu  name (nama frame), marginheight, marginwidth, bordercolor, frameborder, noresize, scrolling, src (dokumen yang ditampilkan pada frame). Element ini tidak mempunyai tag penutup.



Sintaks:

<frame

     name="name"

     marginheight="pixel"

     maginwidth="pixel"

     bordercolor="color"

     frameborder="yes"|"no"

     noresize

     scrolling="yes"|"no"

     src="uri">





ELEMENT NOFRAMES

Element NOFRAME mendefinisikan isi yang akan ditampilkan jika suatu frame tidak dapat diakses .



Sintaks:

<noframes>

.....................

</noframes>













LATIHAN

Gunakan teks editor misalkan "Notepad" untuk menyunting dan menyimpan script latihan di bawah ini. Untuk melihat hasilnya bukalah file tersebut dengan menggunakan web browser atau gunakan editor yang telah tersedia pada modul ini dengan mengklik menu Editor.





Latihan 1:

Bagilah jendela menjadi dua frame secara vertikal dengan komposisi 40% untuk dokumen left.html dan 60% untuk dokumen right.html.





Nama file: latihan8_1.html

<html>

<head>

<title>Latihan8-1</title>

</head>

<frameset cols="40%,60%">

<frame src="left.html">

<frame src="right.html">

</frameset>

<body>

</body>

</html>

Catatan: penulisan nilai attribute cols dapat juga ditulis cols="40%,*".





Latihan 2:

Dari latihan 1 ubahlah dengan memberikan warna merah pada border dengan ukuran 10pixel.



   

Nama file: latihan8_2.html

<html>

<head>

<title>Latihan8-2</title>

</head>

<frameset cols="40%,*" border="10" bordercolor="red">

<frame src="left.html">

<frame src="right.html">

</frameset>

<body>

</body>

</html>





Latihan 3:

Dari latihan 2, tambahkan pada frame dokumen right.html dengan margin 50pixel.



   

Nama file: latihan8_3.html

<html>

<head>

<title>Latihan8-3</title>

</head>

<frameset cols="40%,*" border="10" bordercolor="red">

<frame src="left.html">

<frame src="right.html" marginheight="50" marginwidth="50">

</frameset>

<body>

</body>

</html>

No comments:

Post a Comment