<iframe>: عنصر IFRAME
آخر تحديث: 2026-10-13
<iframe>عنصر IFRAME
يضم صفحة ويب أو موردًا آخر بشكل مضمّن (صورة داخل صورة)، شائع للخرائط والفيديو والأدوات.
| الفئة | البرامج النصية والتضمين |
|---|---|
| نموذج المحتوى | محتوى تدفقي |
| العناصر الأم المسموحة | أي عنصر يقبل المحتوى التدفقي |
| وسم الإغلاق | نعم — يتطلب إغلاق </iframe> وسم |
| الحالة | قياسي |
📝 البنية
<iframe src="https://example.com"></iframe>⚙️ السمات
يدعم هذا العنصر السمات العامة بالإضافة إلى ما يلي:
| السمة | القيمة | الوصف |
|---|---|---|
src | URL of the page to embed. | |
srcdoc | Inline HTML string as the embedded content (overrides src). | |
width | Width of the embedded area. | |
height | Height of the embedded area. | |
title | Accessible title describing the embed (required). | |
sandbox | Restricts embedded content permissions. |
▶ مثال
عدّل الكود أدناه وشاهد النتيجة المباشرة في الملعب:
🌐 دعم المتصفح
| المتصفح |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <iframe> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| مدعوم في جميع المتصفحات الرئيسية | |||||
نصيحة： أضف title دائمًا لإمكانية الوصول؛ sandbox يقلل مخاطر الأمان من المحتوى المضمّن.
❓ الأسئلة الشائعة
Qهل يُعاقَب iframe من طرف SEO؟
Aمحتوى iframe لا ينتمي إلى الصفحة الأم — محركات البحث تزحف وتُرتب مستند src نفسه. التضمين القليل (خرائط وفيديو) غير ضار؛ أما حشر المحتوى الجوهري داخل iframe فيحرم الصفحة الأم من مساهمته في الترتيب. تجنب تحميل المحتوى الرئيسي عبر iframe.
Qما فائدة سمة sandbox في iframe؟
A
sandbox قفل أمان على المحتوى المضمّن: يمنع السكربتات والنماذج والوصول same-origin افتراضيًا، ويمكن رفع المنع بندًا بندًا بقيم القائمة البيضاء مثل sandbox='allow-scripts allow-same-origin'. أضف sandbox حتمًا عند تضمين محتوى أطراف ثالثة لتقليل المخاطر إلى أدنى حد.Qكيف يُنجز فيديو 16:9 متجاوبًا داخل iframe؟
Aالحل الكلاسيكي بحاوية خارجية:
div { position: relative; padding-top: 56.25%; } مع iframe { position: absolute; inset: 0; width: 100%; height: 100%; }. والمتصفحات الحديثة تقبل aspect-ratio: 16/9 على iframe مباشرة.🏷️ وسوم ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قادمة قريبًا — ترقبوا.
📚 دروس ذات صلة
