آیفریمها (Iframes) در HTML
یک آیفریم (iframe) در HTML برای نمایش یک صفحه وب در دل یک صفحه وب دیگر استفاده میشود.
سینتکس آیفریم در HTML
تگ <iframe> در HTML یک قاب درونخطی (inline frame) را مشخص میکند. از یک قاب درونخطی برای جاسازی یک سند دیگر در داخل سند HTML فعلی استفاده میشود.
سینتکس
<iframe src="url" title="description"></iframe>
نکته: همیشه یک خصوصیت title برای <iframe> قرار دهید. این کار یک رویه خوب است و توسط صفحهخوانها (screen readers) استفاده میشود تا محتوای آیفریم را برای کاربر بخوانند.
آیفریم - تنظیم ارتفاع و عرض
از خصوصیتهای height و width برای مشخص کردن اندازه آیفریم استفاده کنید. ارتفاع و عرض بهطور پیشفرض بر حسب پیکسل مشخص میشوند:
مثال
<iframe src="demo_iframe.htm" height="200" width="300" title="Iframe Example"></iframe>
همچنین میتوانید خصوصیت style را اضافه کرده و از ویژگیهای height و width در CSS استفاده کنید:
مثال
<iframe src="demo_iframe.htm" style="height:200px;width:300px;" title="Iframe Example"></iframe>
آیفریم - حذف حاشیه
بهطور پیشفرض، یک آیفریم دارای یک حاشیه (border) در اطراف خود است. برای حذف این حاشیه، خصوصیت style را اضافه کرده و از ویژگی border در CSS استفاده کنید:
مثال
<iframe src="demo_iframe.htm" style="border:none;" title="Iframe Example"></iframe>
با CSS، شما همچنین میتوانید اندازه، استایل و رنگ حاشیه آیفریم را تغییر دهید:
مثال
<iframe src="demo_iframe.htm" style="border:2px solid red;" title="Iframe Example"></iframe>
آیفریم - مقصد برای یک لینک
یک آیفریم میتواند به عنوان قاب مقصد برای یک لینک استفاده شود. خصوصیت target در لینک باید به خصوصیت name در آیفریم اشاره کند:
مثال
<iframe src="demo_iframe.htm" name="iframe_a" title="Iframe Example"></iframe>
<p>
<a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a>
</p>خلاصه فصل
-
تگ
<iframe>در HTML یک قاب درونخطی را مشخص میکند. -
خصوصیت
srcآدرس (URL) صفحهای که باید جاسازی شود را تعریف میکند. -
همیشه خصوصیت
titleرا قرار دهید (برای صفحهخوانها). -
خصوصیتهای
heightوwidthاندازه آیفریم را مشخص میکنند. -
از
border:none;برای حذف حاشیه دور آیفریم استفاده کنید.
تگ آیفریم در HTML