แท็ก <frame> ใช้กำหนดเนื้อหาของแต่ละเฟรมภายใน <frameset> อยู่ในสถานะ Deprecated และ ไม่รองรับใน HTML5 ห้ามใช้ ควรใช้ <iframe> แทน
แอตทริบิวต์ (สำหรับอ้างอิงทางประวัติศาสตร์)
| แอตทริบิวต์ | ค่า | คำอธิบาย |
|---|---|---|
| src | URL | ที่อยู่ไฟล์เนื้อหาของเฟรม |
| name | ชื่อเฟรม | ชื่อเพื่อใช้เป็น target ของลิงก์ |
| frameborder | 0 หรือ 1 | แสดงขอบเฟรมหรือไม่ |
| marginwidth | พิกเซล | ระยะขอบซ้าย-ขวา |
| marginheight | พิกเซล | ระยะขอบบน-ล่าง |
| noresize | noresize | ห้ามปรับขนาดเฟรมโดยผู้ใช้ |
| scrolling | yes, no, auto | การแสดง Scrollbar |
ตัวอย่างโค้ดเก่า (ไม่แนะนำ)
<!DOCTYPE html>
<html>
<head>
<title>ตัวอย่าง HTML frame Tag</title>
</head>
<frameset cols="200, *">
<frame src="/html/menu.htm" name="menu_page" />
<frame src="/html/main.htm" name="main_page" />
<noframes>
<body>เบราว์เซอร์ของคุณไม่รองรับเฟรม</body>
</noframes>
</frameset>
</html>
แทนที่ด้วย <iframe> (แนะนำ)
<!-- iframe ทันสมัย -->
<iframe src="menu.htm" width="200" height="100%" style="border: none;" title="เมนู"></iframe>
<iframe src="main.htm" style="flex: 1; border: none;" title="เนื้อหาหลัก"></iframe>
<style>
.container { display: flex; height: 100vh; }
</style>
ข้อได้เปรียบของ iframe
- รองรับ HTML5 อย่างเต็มที่
- สามารถ sandbox ได้ (
sandboxattribute) - จัดรูปแบบด้วย CSS ได้อิสระ
- เข้าถึงได้ผ่าน JavaScript (
contentWindow)