Langsung ke konten utama

HTML FRAME

Oleh

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element frame untuk menampilkan informasi dalam bentuk subwindows.

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>


 


 

Label:

Komentar

Posting Komentar

Postingan populer dari blog ini

what is (apa itu) XML ???

Oleh
source: wikipedia and w3school XML (Extensible Markup Language) adalah bahasa markup untuk keperluan umum yang disarankan oleh W3C untuk membuat dokumen markup keperluan pertukaran data antar sistem yang beraneka ragam. XML merupakan kelanjutan dari HTML (HyperText Markup Language) yang merupakan bahasa standar untuk melacak Internet. Mengenal XML XML didesain untuk mempu menyimpan data secara ringkas dan mudah diatur. Kata kunci utama XML adalah data (jamak dari datum) yang jika diolah bisa memberikan informasi. XML menyediakan suatu cara terstandarisasi namun bisa dimodifikasi untuk menggambarkan isi dari dokumen. Dengan sendirinya, XML dapat digunakan untuk menggambarkan sembarang view database, tetapi dengan suatu cara yang standar. Tipe XML XML memiliki tiga tipe file :     XML, merupakan standar format dari struktur berkas (file).     XSL, merupakan standar untuk memodifikasi data yang diimpor atau diekspor.     XSD, merupakan stan...
Posting Komentar
lanjut baca??

TheReiko Day + Event Christmas

Oleh
Tools : 1.  Fiddler 2.  File Swf Features: 1. Instant All Mission TP 2. Auto Kill Boss 3. Complete Daily Task 4. Kill Boss Event (Yukidaruma) 5. Instant Special Mission (Christmas) Instructions: • Drag files to fiddler • Clear Cache • Open Ninja Saga • Go to Shop > Select According To What You Want  
Posting Komentar
lanjut baca??

Chord Radja Yakin

Oleh
Author : dewaphobia Am F G   C Bukalah hatimu untuk diriku Am F     G Em Sebelum cinta hilang Am F G        C Seperti bintang kupuja dirimu Am F     G Em Seperti malam datang      Am      Dm Yakinkan cintamu kepadaku  Gm     Cm Agar aku bisa memiliki   Fm    A#m        Am   Em Setulus hatiku mencintai dirimu Am Dm Lupakanlah semua mimpi-mimpi     Gm   Cm Walaupun bayangnya menghantui      Fm   A#m       Am   Em Yang kadang selalu ingin memilih ci...
Posting Komentar
lanjut baca??