Membuat Frameset di HTML
Assalamualaikum wr. wb.
okay kali ini saya akan bagi bagi ilmu lagi yang saya telah terima di bangku perkuliahan di Matakuliah Desain Web, dan kali ini saya akan praktikan bagaimana cara mendesain web sederhana berbekal HTML menggunakan FRAME.
Disini cukup susah susah gampang kalau teliti insyaAllah gampang dehh kita mulai saja ya denganpembuatannya ya.
pertama kita buat dulu bagian bagian framenya ya:
let’s cek the coding:
<!DOCTYPE html>
<html>
<head>
<title>Frame Top</title>
</head>
<frameset rows="100,*" cols="*" frameborder="yes" border"2" framespacing="2">
<frame src="Frametop.html" name="topframe" scrolling="no" noresize=>
<frameset rows="*" cols="250,*" frameborder="yes" border"2" framespacing="2">
<frame src="Frameleft.html" name="leftframe" scrolling="yes" noresize=>
<frame src="Framemain.html" name="mainframe" scrolling="yes" noresize=>
</frameset>
<body>
</body>
</html>
nah dapat dilihat bahwa codingan yang kita buat tidak dapat tampilan, malah terdapat tulisan “it may been moved or delected.” dalam kasus ini karena kita belum membuat bagian dari isi frame kita.
okay lalu kita buat dulu tampilan awalannya di mana ita akan membuat tampilan top dengan tulisan yang bisa bergerak.
oh iya di sini kita buat file baru yang berekstensi html kalau aku pake “frametop.html”
let’s cek the coding:
<!DOCTYPE html>
<html>
<head>
<title>Frame Utama</title>
</head>
<body bgcolor="Brown">
<h1><marquee behavior="alternate">SELAMAT DATANG</marquee></h1>
</body>
</html>
hasil keluaran:
disini kita ketambahan materi penggunaan tag marquee dimana tag ini membuat teks berjalan dan atributnya yaitu behavior di sini behavioe ada banyak tp disini aku make “alternate”, dan atribut direction penentuan arah darimana mau munculnya kanan, kiri, bawah, atas di sini saya pakai dari kanan.
lalu kita buat bagian menu di bagian sebelah kiri nya dimana di sini adalah menu yang dapat kita klik agar dapat membuka bagian bagian lain di frame main
let’s cek the coding:
<!DOCTYPE html>
<html>
<head>
<title>Frameleft</title>
</head>
<body bgcolor="Grey">
<div>
<ul>
<li><a href="bljr2.html" target="mainframe">PENDAFTARAN</a></li>
<br>
<li><a href="bljr3.html" target="mainframe">PAGE FORM</a></li>
<br>
<li><a href="bljr4.html" target="mainframe">FORM LOGIN</a></li>
<br>
<li><a href="bljr5.html" target="mainframe">ABOUT AK 2015</a></li>
</ul>
</div>
</body>
</html>
akan mengeluarkan tampilan:
nah jangan lupa buat juga file berekstensi html untuk menu konten dan kontak agar bisa terbuka nantinya.
lalu kita isikan bagian main agar terlihat lebih nyata di bagian pembuatan web kali ini:
let’s chek the coding:
<!DOCTYPE html>
<html>
<head>
<title>Mainframe</title>
</head>
<body bgcolor="orange">
<font><h1><center>PROFIL :</center></h1></font>
<div>
<font>Nama : Septian harun</font>
<br>
<font>Nim : 131318048</font>
<br>
<font>Kelas: Teknik Informatika_1B</font>
</div>
<Center><img src="kartun1.JPG" width="350" height="350"></img></Center>
</body>
</html>
Akan mendapat keluaran :
Ketika Di Satukan Maka Akan mendapatkan Hasil Seperti Di Bawah Ini :
Thanks for the attention
Wassalamualaikum wr. wb.
Tidak ada komentar:
Biasakan Mengomentari Dengan Pemikiran Yang Dewasa :)