انتقل إلى محتوى الدرس

Three Ways to Insert CSS طرق إدراج أنماط CSS الثلاث

قارن عملياً بين طرق ربط أنماط CSS الثلاث عبر الملف الخارجي ووسم style الداخلي والسمة السطرية، واكتشف فرق الأداء مع @import وفحص رؤوس الشبكة.
3 صفوف تعليمية
لغة CSS
4,970 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

بعد أن تعلّمت صياغة قواعد CSS واختيار محدداتها، يبرز السؤال العملي الأهم: أين نضع هذه القواعد لكي يقرأها المتصفح؟ تدعم جميع المتصفحات ثلاث طرق قياسية لإدراج الأنماط في صفحة HTML:

  1. الملف الخارجي — External CSS: حفظ القواعد في ملف مستقل بامتداد .css وربطه عبر وسم <link>، وهو الخيار الاحترافي الأول للمشاريع الحقيقية.
  2. النمط الداخلي — Internal CSS: كتابة القواعد داخل وسم <style> في منطقة <head> للتجارب السريعة أو الصفحة المنفردة.
  3. النمط السطري — Inline CSS: كتابة التصريحات مباشرةً داخل سمة style="..." على الوسم نفسه في حالات استثنائية نادرة.
الصف 2 صورة توضيحية
مخطط يقارن بين الملف الخارجي عبر link والنمط الداخلي عبر style والنمط السطري على العنصر
الصف 3 ملاحظة هامة