تشمل المواقع المختلفة الخاصة بهم الخارجية اوراق النمط المتعاقب بطرق مختلفة — إما باستخدام نهج الاستيراد @ أو عن طريق الارتباط بملف CSS هذا. ما الفرق بينimport و link لـ CSS ، وكيف قررت أيهما أفضل بالنسبة لك؟
الفرق بينimport و Link
الربط هو الطريقة الأولى لتضمين ورقة أنماط خارجية على صفحات الويب الخاصة بك. الغرض منه هو ربط صفحتك بورقة الأنماط الخاصة بك. يضاف إلى رأس الخاص بك مستند HTML.
يسمح لك الاستيراد باستيراد ورقة أنماط واحدة إلى أخرى. يختلف هذا قليلاً عن سيناريو الارتباط لأنه يمكنك استيراد أوراق أنماط داخل ورقة أنماط مرتبطة.
من وجهة نظر المعايير ، لا يوجد فرق بين الارتباط بورقة أنماط خارجية أو استيرادها. كلتا الطريقتين صحيحة وستعمل كلتا الحالتين بشكل جيد في معظم الحالات. ومع ذلك ، هناك عدة أسباب قد تجعلك ترغب في استخدام أحدهما على الآخر.
لماذا استخدمimport؟
منذ عدة سنوات ، كان السبب الأكثر شيوعًا لاستخدامimport بدلاً من ذلك (أو مع) هو أن المتصفحات القديمة لم تتعرف علىimport ، لذا يمكنك إخفاء الأنماط عنها. باستيراد أوراق الأنماط الخاصة بك ، فإنك في الأساس تجعلها متاحة للمتصفحات الأكثر حداثة والتي تتوافق مع المعايير بينما "تخفيها" من إصدارات المستعرض الأقدم.
استخدام آخر لطريقةimport هو استخدام أوراق أنماط متعددة على الصفحة ، مع تضمين رابط واحد فقط في عنوان المستند. على سبيل المثال ، قد يكون لدى الشركة ورقة أنماط عامة لكل صفحة على الموقع ، مع أقسام فرعية لها أنماط إضافية لا تنطبق إلا على هذا القسم الفرعي. من خلال الارتباط بورقة أنماط القسم الفرعي واستيراد الأنماط العامة في الجزء العلوي من هذا النمط ورقة ، ليس عليك الحفاظ على ورقة أنماط عملاقة مع جميع الأنماط الخاصة بالموقع وكل القسم الفرعي. الشرط الوحيد هو أن أي قواعد استيراد يجب أن تأتي قبل بقية قواعد أسلوبك. ميراث لا يزال من الممكن أن يكون مشكلة.
لماذا استخدم الرابط؟
السبب الأول لاستخدام أوراق الأنماط المرتبطة هو توفير أوراق أنماط بديلة لعملائك. تدعم المتصفحات مثل Firefox و Safari و Opera السمة rel = "alternate styleheet" وعندما يتوفر أحدها سيسمح للمشاهدين بالتبديل بينهم. يمكنك أيضًا استخدام محوّل JavaScript للتبديل بين أوراق الأنماط في IE — غالبًا ما تستخدم مع تخطيطات التكبير لأغراض الوصول.
تتمثل إحدى عيوب استخدامimport في أنه إذا كان لديك رأس بسيط للغاية به قاعدةimport فقط ، فقد تعرض صفحاتك "وميض محتوى غير منظم" أثناء تحميلها. إصلاح بسيط لذلك هو التأكد من وجود رابط أو عنصر نصي إضافي واحد على الأقل في رأسك.
ماذا عن نوع الوسائط؟
يؤكد العديد من الكتاب أنه يمكنك استخدام نوع الوسائط لإخفاء أوراق الأنماط من المتصفحات القديمة. غالبًا ما يذكرون هذه الفكرة على أنها فائدة لاستخدامimport أو ، ولكن يمكنك ضبط الوسائط اكتب بأي من الطريقتين ، ولن تعرضها المتصفحات القديمة التي لا تدعم أنواع الوسائط أيضًا قضية.
إذن ما الطريقة التي يجب أن تستخدمها؟
يستخدم معظم المطورين اليوم الارتباط ثم يستوردون أوراق الأنماط إلى أوراق الأنماط الخارجية. بهذه الطريقة ، لديك فقط سطر أو سطرين من التعليمات البرمجية لضبطها في مستندات HTML الخاصة بك. لكن خلاصة القول هي أن الأمر متروك لك. إذا كنت تشعر براحة أكبر معimport ، فابحث عنها! تتوافق كلتا الطريقتين مع المعايير وما لم تكن تخطط لدعم المتصفحات القديمة حقًا ، فلا يوجد سبب قوي لاستخدام أي منهما.