Membuat frame 1 baris dan 2 kolom dengan Target Link

Sebelum kita membuat frame kita harus tau apa itu frame dan apa kelebihan serta struktur dari frame itu sendiri.
Kelebihan : Membuat jendela browser menjadi beberapa bagian. Baik secara vertical dan horizontal.
Layout Documents <FRAMESET>….</FRAMESET>
Fungsi : Membuat jendela menjadi beberapa bagian.
Content Documents <FRAME SRC=”url”>
Fungsi : Mengisi dari suatu frame, ini merupakan dokumen HTML
Struktur Dokumen Menggunakan Frame
<HTML>
<HEAD>
<TITLE>……</TITLE>
</HEAD>
<FRAMESET>…….</FRAMESET>
<HTML>
Atribut FRAMESET :
  • COL : Membuat Vertical FRAME
  • ROW : Membuat Horizontal FRAME
  • FRAMESPACING : Spasi di sekitar FRAME
  • FRAMEBORDER : Membuat border pada FRAME
Atribut FRAME SRC :
  • MARGIN WIDTH
  • MARGIN HEIGHT
  • SCROLLING
  • NORESIZE
  • FRAMEBORDER
Frame yang terdiri dari 1 baris dan 2 kolom dengan link target
Induk.html


<html>
<head>
<title>Tugas Frame Gumilar Pratama Adiatna</title>
</head>
<frameset rows=”20%,*”>
<frame SRC=”head.html” >
<frameset cols=”20%,*”>
<frame SRC=”index.html” >
<frame NAME=”target link” src=”" marginwidth=”20″ marginheight=”20″ noresize>
</frameset>
</frameset>
</html>
Index.html
<html>
<head>
<title>Tugas Frame Gumilar Pratama Adiatna</title>
</head>
<body>
<H2 ALIGN=”center”>Index Latihan HTML</H2>
<ul>
<li><A HREF=”form.html” TARGET=”target link”>Latihan Membuat form</A></li>
<li><A HREF=”tabel.html” TARGET=”target link”>Latihan Membuat tabel</A></li>
<li><A HREF=”teks.html” TARGET=”target link”>Latihan Cetak Tebal, Underline, & Garis miring pada tEks</A></li>
<li><A HREF=”pre.html” TARGET=”target link”>Latihan Premormated</A></li>
</ul>
</body>
</html>
Head.html
<html>
<head>
<title>Blog Gumilar Pratama Adiatna</title>
</head>
<body>
<center>
<br><font color=”#0000ff” size=”25″>Blog Gumilar Pratama Adiatna </font>
</center>
</body>
</html>
Form.html
<html>
<head>
<title>latihan 7.1</title>
</head>
<body>
<form method=”POST” action=”mailto:gilar,ever@gmail.com”>
<h4>Form</h4>
<input type=”text” name=”var1″ size=”30″ title=”Masukkan nama lengkap anda”>
<br><br>
<B>Apakah anda sudah 18 tahun..?</b>
<input type=”checkbox” name=”check” >ya<br>
<b>Berapa tanggal lahir anda…?</b><br>
<input type=”radio” name=”radio” value=”r1″>30-35<br>
<input type=”radio” name=”radio” value=”r2″>35-40<br>
<input type=”radio” name=”radio” value=”r3″>40-45<br>
<b>tempat favorit anda…?</b><br>
<select>
<option value=”Sk”>pantai
<option value=”Em” selected>gunung
<option value=”Ns”>mall
</select><br>
<b>Komentar anda tentang program ini…?</b><br>
<textarea valign=”left” name=”textarea” rows=”6″ cols=”30″>
</textarea>
<br>
<input type=”submit” value=”Kirim” name=”submit”>
<input type=”reset” value=”REset” name=”reset”>
</form>
</body>
</html>
Tabel.html
<html>
<head>
<title>Latihan 14</title>
</head>
<body bgcolor=”black”>
<center>
<table align=”center” border=”2″ bgcolor=”yellow” cellpadding=”5″ cellspacing=”0″>
<caption align=”top” ><font color=”white”><b><i><u>ABSEN KULIAH UMUM TAHUN AKADEMIK 2010</u></i></b></font></caption>
<tr>
<th>NO.</th>
<th>Nama</th>
<th>NPM</th>
<th>JURUSAN</th>
<th>JENJANG</th>
</tr>
<tr>
<td>1.</td>
<td>Bayu</td>
<td>4003012144</td>
<td>TEKNIK INFORMATIKA</td>
<td>S1</td>
</tr>
<tr>
<td>2.</td>
<td>Dian</td>
<td>4004010232</td>
<td>SISTEM INFORMASI</td>
<td>S1</td>
</tr>
<tr>
<td>3.</td>
<td>Teguh</td>
<td>3003010217</td>
<td>TEKNIK INFORMATIKA</td>
<td>D3</td>
</tr>
<tr>
<td>4.</td>
<td>Dede</td>
<td>3002010584</td>
<td>MANAJEMEN INFORMATIKA</td>
<td>D3</td>
</tr>
</table>
</center>
</body>
</html>
Teks.html
<html>
<head>
<title>latihan teks</title>
</head>
<body>
Ini normal teks<br>
<b>Ini teks tercetak tebal (bold)</b><br>
<i>Ini teks tercetak miring (italic)</i><br>
<u>Ini teks tercetak garis bawah (underline)</u>
</body>
</html>
Pre.htm
<html>
<head>
<title>Latihan pre</title>
</head>
<body>

0 komentar:

Posting Komentar