HTML Frame

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>
Selamat Mencoba. (a'at)

0 komentar:

Post a Comment

  • Kunci HTML #1
  • Tugas #sisop05 #upnjatim #2012
  • description
  • description
  • description
  • description
  • description
  • description
  • description
  • description

Video

Dual Boot Win8 - Linux Ubuntu 12.04:

Membangun Virtual Host di Linux:

Tugas Pengganti Jarkom

.Net:
Under Construction.
PHP:
Under Construction.
SKRIPSI:
Kelas A35
#3Sistem Informasi Penyewaan KamarBerbasis Web pada Rumah Susun Mahasiswa UPN "Veteran" Jawa Timur
NPM1035010047
Mulai13/05/2014
SelesaiOn Going...
#2Sistem Informasi Akademik Berbasis Web Menggunakan PHP pada LBB Alfa
NPM1035010044
Mulai12/05/2014
SelesaiOn Going...
#1Implementasi Security Layer 2 Menggunakan AP Isolation pada Jaringan Hotspot Cafe Cirkel Crowd Ana Coffee
NPM0735010067
Mulai24/09/2013
SelesaiOn Going...

PKL:
PKL
#4PT. Sumber Karya Perdana
NPM1135010100 | 1135010016 | 1135010109
Mulai12/09/2014
SelesaiOn Going...
#3CV. Solver Media
NPM1135010085 | 1135010053 | 1135010081
Mulai11/09/2014
SelesaiOn Going...
#2Java Tour & Travels
NPM1135010006 | 1135010011 | 1135010013
Mulai10/06/2014
SelesaiOn Going...
#1CV. Guntur Mandiri
NPM1135010023 | 1135010075 | 1135010067
Mulai06/05/2014
SelesaiOn Going...

2

Notice!!!

1. Untuk pengiriman tugas via email, periksa kembali subject email dan nama file attachment yang telah disepakati pada penetuan rule kelas dan penetapan deadline tugas.