Belajar HTML Part 17: Penggunaan Tag Iframe Pada HTML

Penggunaan Tag Iframe Pada HTML

Iframe digunakan untuk menampilkan halaman web dalam halaman web.

Sintaks iframe

HTML iframe didefinisikan dengan tag <iframe>:

Atribut src menentukan URL (alamat web) dari halaman kerangka inline.

Iframe - Mengatur Tinggi dan Lebar

Gunakan atribut Height dan Width untuk menentukan ukuran iframe.

Nilai atribut ditentukan dalam piksel secara default, namun jumlahnya juga bisa dalam persen (seperti "80%").

Contoh Code:

<!DOCTYPE html>
<html>
<body>
<iframe src="demo_iframe.htm" height="200" width="300"></iframe>
</body>
</html>

Iframe - Hapus Perbatasan

Secara default, iframe memiliki batas di sekelilingnya.

Untuk menghapus perbatasan, tambahkan atribut style dan gunakan properti border CSS:

Contoh Code:

<!DOCTYPE html>
<html>
<body>
<iframe src="demo_iframe.htm" style="border:none;"></iframe>
</body>
</html>

Dengan CSS, Anda juga dapat mengubah ukuran, style dan warna batas iframe:

Contoh Code:

<!DOCTYPE html>
<html>
<body>
<iframe src="demo_iframe.htm" style="border:2px solid grey;"></iframe>
</body>
</html>

Iframe - Targetkan sebuah Link

Iframe dapat digunakan sebagai bingkai target untuk sebuah link.

Atribut target tautan harus mengacu pada atribut nama iframe:

Contoh Code:

<!DOCTYPE html>
<html>
<body>
<iframe height="300px" width="100%" src="demo_iframe.htm" name="iframe_a"></iframe>
<p><a href="https://nusantaracoding.blogspot.co.id/" target="iframe_a">Nusantara Coding</a></p>
<p>Bila target tautan cocok dengan nama iframe, tautan akan terbuka di iframe.</p>
</body>
</html>

HTML iframe Tag

Tag	Description
<iframe>	Mendefinisikan sebuah kerangka inline

Belajar HTML Secara Lengkap Disini:
1. Tutorial HTML Bagian 1
2. Tutorial HTML Bagian 2