<link>: عنصر LINK
آخر تحديث: 2026-10-13
<link>عنصر LINK
يعرّف علاقة بين المستند الحالي ومورد خارجي، غالبًا ورقة أنماط CSS وأيضًا الأيقونات أو التحميل المسبق.
| الفئة | البيانات الوصفية |
|---|---|
| نموذج المحتوى | محتوى تدفقي |
| العناصر الأم المسموحة | أي عنصر يقبل المحتوى التدفقي |
| وسم الإغلاق | ذاتي الإغلاق — لا حاجة لوسم إغلاق |
| الحالة | قياسي |
📝 البنية
<link rel="stylesheet" href="style.css">
⚙️ السمات
يدعم هذا العنصر السمات العامة بالإضافة إلى ما يلي:
| السمة | القيمة | الوصف |
|---|---|---|
rel | Relationship: stylesheet, icon, preload, alternate, etc. | |
href | URL of the external resource. | |
type | MIME type of the resource (e.g. text/css). | |
media | Media/device condition the resource applies to. | |
sizes | Icon sizes for rel=icon (e.g. 32x32). |
▶ مثال
عدّل الكود أدناه وشاهد النتيجة المباشرة في الملعب:
🌐 دعم المتصفح
| المتصفح | |||||
|---|---|---|---|---|---|
| <link> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| مدعوم في جميع المتصفحات الرئيسية | |||||
نصيحة: link عنصر فارغ؛ rel="stylesheet" هو الاستخدام الأكثر شيوعًا.
❓ الأسئلة الشائعة
Qما القيم الشائعة لسمة rel في link؟
Aورقة الأنماط
stylesheet، وأيقونة الموقع icon، والتحميل المسبق preload/prefetch/preconnect، والرابط القياسي canonical، وتسمية اللغات alternate، وRSS بـ alternate type='application/rss+xml'. فـ rel يحدد وظيفة link وهو روحه الجوهرية.Qما الفرق بين preload و prefetch؟
A
preload للموارد الحرجة «التي تحتاجها هذه الصفحة حالًا» (خطوط الشاشة الأولى وCSS الحرجة) بتحميل فوري عالي الأولوية؛ وprefetch لموارد «قد تحتاجها الصفحة التالية» بتحميل منخفض الأولوية في وقت الخمول. والخطأ في الاختيار يهدر النطاق — preload لموارد الصفحة الحالية وprefetch للموارد العابرة للصفحات.Qكيف يُضبط favicon عبر link؟
Aالكتابة الحديثة:
<link rel='icon' href='/favicon.ico' sizes='any'> مع <link rel='icon' type='image/svg+xml' href='/icon.svg'>؛ وأيقونة شاشة اللمس لأبل بـ rel='apple-touch-icon'. وحتى بدون link يطلب المتصفح /favicon.ico افتراضيًا.🏷️ وسوم ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قادمة قريبًا — ترقبوا.