praktikum web programming iv · 2014. 4. 11. · html frame dengan frame, kita dapat menampilkan...
TRANSCRIPT
![Page 1: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/1.jpg)
Praktikum Web Programming IV
HTML Frame
![Page 2: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/2.jpg)
HTML FrameDengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut sebuah frame dan setiap frame berdiri sendiri.
Tag <frameset> mendefinisikan bagaimana membagi jendela menjadi frame
Setiap frameset mendefinisikan jumlah baris dan kolom
Tag <frame> mendefinisikan dokumen HTML yang akan ditampilkan dalam tiap frame.
Contoh :
Buat sebuah dokumen HTML dengan menggunakan Dreamweaver dan ketikkan listing berikut:
<html>
<frameset cols="25%,50%,25%">
<frame src="Praktikum 1.html">
<frame src="Praktikum 2.html">
<frame src="Praktikum 3.html">
</frameset>
</html>
Simpan dengan nama Praktikum 12.html.
Jalankan menggunakan Web Browser.
![Page 3: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/3.jpg)
HTML FrameVertical Frameset
![Page 4: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/4.jpg)
HTML FrameHorizontal Frameset
Contoh :
Buat sebuah dokumen HTML dengan menggunakan Dreamweaver dan ketikkan listing berikut:
<html>
<frameset rows="25%,50%,25%">
<frame src="Praktikum 4.html">
<frame src="Praktikum 5.html">
<frame src="Praktikum 6.html">
</frameset>
</html>
Simpan dengan nama Praktikum 13.html.
Jalankan menggunakan Web Browser.
![Page 5: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/5.jpg)
HTML FrameHorizontal Frameset
![Page 6: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/6.jpg)
HTML FrameMixed Frameset
Contoh :
Buat sebuah dokumen HTML dengan menggunakan Dreamweaver dan ketikkan listing berikut:
<html>
<frameset rows="50%,50%">
<frame src="Praktikum 7.html">
<frameset cols="25%,75%">
<frame src="Praktikum 8.html">
<frame src="Praktikum 9.html">
</frameset>
</frameset>
</html>
Simpan dengan nama Praktikum 14.html.
Jalankan menggunakan Web Browser.
![Page 7: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/7.jpg)
HTML FrameMixed Frameset
![Page 8: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/8.jpg)
HTML FrameInline Frame
Contoh :
Buat sebuah dokumen HTML dengan menggunakan Dreamweaver dan ketikkan listing berikut:
<html>
<body>
<iframe src="Praktikum 10.html"></iframe>
<p>Beberapa browser versi lama tidak mendukung iframes.</p>
<p>Jika browser tidak mendukung, iframe tidak akan kelihatan.</p>
</body>
</html>
Simpan dengan nama Praktikum 15.html.
Jalankan menggunakan Web Browser.
![Page 9: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/9.jpg)
HTML FrameInline Frame
![Page 10: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/10.jpg)
HTML FrameNavigation Frame
Contoh 1:
Buat sebuah dokumen HTML dengan menggunakan Dreamweaver dan ketikkan listing berikut:
<html>
<body>
<a href ="Praktikum 1.html" target ="showframe">Praktikum 1</a><br>
<a href ="Praktikum 2.html" target ="showframe">Praktikum 2</a><br>
<a href ="Praktikum 3.html" target ="showframe">Praktikum 3</a>
</body>
</html>
Simpan dengan nama Praktikum 16.html.
![Page 11: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/11.jpg)
HTML FrameNavigation Frame
Contoh 2:
Buat sebuah dokumen HTML dengan menggunakan Dreamweaver dan ketikkan listing berikut:
<html>
<frameset cols="120,*">
<frame src="Praktikum 16.html">
<frame src="Praktikum 1.html" name="showframe">
</frameset>
</html>
Simpan dengan nama Praktikum 17.html.
Jalankan dengan menggunakan Web Browser.
![Page 12: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/12.jpg)
HTML FrameNavigation Frame
![Page 13: Praktikum Web Programming IV · 2014. 4. 11. · HTML Frame Dengan frame, kita dapat menampilkan lebih dari 1 dokumen HTML dalam jendela browser yang sama. Setiap dokumen HTML disebut](https://reader035.vdocuments.pub/reader035/viewer/2022081403/6099a47208a0a414c11fbdec/html5/thumbnails/13.jpg)
LatihanBuatlah file dengan nama Latihan3.html, untuk menghasilkan output sbb :