كيف يعمل الـ CSS ؟
عندما يقرأ المتصفح ورقة النمط
فأنه سيقوم بنتسيق مستند الـ HTML وفقا للمعلومات الموجودة في ورقة النمط
و هناك ثلاثة طرق لإدراج الـ CSS
1. ورقة نمط خارجية .
2. ورقة نمط داخلية .
3. نمط مضمن .
الطريقة الأولى : ورقة نمط خارجية .
مع ورقة النمط الخارجية تستطيع تغيير مظهر موقع كامل فقط عن طريق تغيير ملف واحد
يجب أن تحتوي كل صفحة على مرجع لملف ورقة النمط الخارجية داخل العنصر LINK و العنصر LINK موجود داخل القسم HEAD
و أية ورقة نمط خارجية ممكن أن تكتب بأي محرر نصوص
و الملف ينبغي أن لا يحوي أية وسوم HTML .
و ملف ورقة النمط يجب أن تحفظ باللاحقة .css
ملاحظة :
لا تضيف أي مسافة بين قيمة الخاصية و الوحدة المرادفة لها
ورقة النمط الداخلية :
ورقة النمط الداخلية ربما تستعمل لصفحة مفردة
و تمتلك نمط فريد لا يتكرر في الصفحات الأخرى خاصة بتلك الصفحة فقط
و يتم تعريف الأنماط الداخلية داخل العنصر style في القسم head داخل صفحة الموقع
الأنماط المضمنة :
النمط المضمن ربما يستعمل لتطبيق نمط فريد على عنصر واحد
لاستخدام نمط مضمن قم بإضافة السمة style إلى العنصر ذات الصلة
و السمة style ممكن ان تحتوي أي خاصية css
تلميح :
النمط المضمن يفقد العديد من مزايا أوراق الأنماط و ذلك لمزج المحتوى مع العرض التقديمي
لذلك ينصح باستعمال هذه الطريقة في مواضع معينة و عدم الاعتماد عليها بشكل كلي .
أوراق نمط متعددة :
إذا تم تعريف بعض الخصائص لنفس المحدد ( العنصر ) في أوراق أنماط مختلفة سيتم استخدام القيمة من آخر ورقة نمط يتم قرأتها من قبل المتصفح .
أي نمط سوف يستخدم عندما يوجد أكثر من نمط محدد لعنصر الـ html ؟
بشكل عام يمكننا القول بأن جميع تلك الأنماط سوف تتوالى داخل ورقة نمط إفتراضية متبعة القواعد التالية حيث الرقم 1 له الأولوية :
1. النمط المضمن ( داخل أي عنصر html )
2. ورقة النمط الداخلية و الخارجية في القسم head
3. افتراضيات المتصفح
استنادا لما سبق فإن النمط المضمن له الأولوية في التطبيق
مما يعني أنه سيتم تجاوز النمط المحدد للعنصر داخل العلامة head
أو في ورقة النمط الخارجية
أو القيم الافتراضية للمستعرض .