אתרים שונים כוללים את החיצוניים שלהם גליונות סגנון מדורגים בדרכים שונות - באמצעות הגישה @ import או על ידי קישור לקובץ CSS זה. מה ההבדל בין @ import ו קישור ל- CSS, ואיך החלטת איזה מהם עדיף לך?
ההבדל בין @ יבוא לקישור
קישור היא השיטה הראשונה לכלול גיליון סגנונות חיצוני בדפי האינטרנט שלך. זה נועד לקשר את הדף שלך לגליון הסגנון שלך. זה מתווסף לראש שלך מסמך HTML.
ייבוא מאפשר לך לייבא גיליון סגנונות אחד לשני. זה שונה במקצת מתרחיש הקישורים מכיוון שתוכל לייבא גיליונות סגנון לגליון סגנון מקושר.
מנקודת מבט סטנדרטית, אין הבדל בין קישור לגיליון סגנון חיצוני או ייבואו. כך או כך היא נכונה ושני הצדדים יעבדו באותה מידה ברוב המקרים. עם זאת, ישנן כמה סיבות שאולי תרצה להשתמש אחת על השנייה.
למה להשתמש ב- @ import?
לפני שנים רבות, הסיבה הנפוצה ביותר שניתנה לשימוש ב- @import במקום (או יחד עם) היא מכיוון שדפדפנים ישנים לא זיהו את @import, כך שתוכל להסתיר מהם סגנונות. על ידי ייבוא גליונות הסגנון שלך, אתה בעצם הופך אותם לזמינים לדפדפנים מודרניים יותר ותואמי תקנים תוך שאתה "מסתיר" אותם מה גרסאות דפדפן ישנות יותר.
שימוש נוסף בשיטת @import הוא שימוש בגיליונות סגנון מרובים בעמוד, תוך שהוא כולל רק קישור יחיד בראש המסמך. לדוגמא, לתאגיד עשוי להיות דף סגנונות גלובלי לכל עמוד באתר, כאשר בחלקי המשנה יש סגנונות נוספים החלים רק על תת-חלק זה. על ידי קישור לגיליון הסגנונות של תת המשנה וייבוא הסגנונות הגלובליים בראש אותו סגנון גיליון, אתה לא צריך לשמור על גיליון סגנונות ענק עם כל הסגנונות לאתר ולכל סעיף משנה. הדרישה היחידה היא שכל כללי @import צריכים לבוא לפני שאר כללי הסגנון שלך. יְרוּשָׁה עדיין יכולה להיות בעיה.
מדוע להשתמש בקישור?
הסיבה מספר 1 לשימוש בגיליונות סגנון מקושרים היא לספק גליונות סגנון חלופיים ללקוחות שלך. דפדפנים כמו פיירפוקס, ספארי ואופרה תומכים במאפיין rel = "גיליון סגנונות חלופי" וכאשר ישנו זמין יאפשרו לצופים לעבור ביניהם. תוכל גם להשתמש במתג JavaScript כדי לעבור בין גיליונות סגנון ב- IE - לרוב בשימוש עם פריסות זום למטרות נגישות.
אחד החסרונות בשימוש ב- @ import הוא שאם יש לך ראש פשוט מאוד עם כלל ה- @ import, הדפים שלך עשויים להציג "הבזק של תוכן לא מעוצב" בזמן שהם נטענים. תיקון פשוט לכך הוא לוודא שיש לך לפחות קישור או רכיב סקריפט אחד נוסף בראשך.
מה לגבי סוג המדיה?
כותבים רבים טוענים כי ניתן להשתמש בסוג המדיה כדי להסתיר דפי סגנון מדפדפנים ישנים יותר. לעתים קרובות הם מזכירים רעיון זה כיתרון לשימוש ב- @import או, אך אתה יכול להגדיר את המדיה הקלד באחת משתי השיטות, ודפדפנים ישנים יותר שאינם תומכים בסוגי מדיה לא יראו אותם בשניהם מקרה.
אז באיזו שיטה כדאי להשתמש?
רוב המפתחים כיום משתמשים בקישור ואז מייבאים גיליונות סגנון לגיליונות סגנון חיצוניים. בדרך זו, יש לך רק שורת קוד אחת או שתיים להתאים במסמכי ה- HTML שלך. אבל בשורה התחתונה זה תלוי בך. אם נוח לך יותר עם @ import, אז תלך על זה! שתי השיטות תואמות סטנדרטים, אלא אם כן אתה מתכנן לתמוך בדפדפנים ישנים באמת, אין שום סיבה חזקה לשימוש בשניהם.