قانون @import CSS

تعریف و استفاده

قانون @import به شما اجازه می‌دهد تا یک پوشش CSS را به یک پوشش دیگر وارد کنید.

قانون @import باید در بالای مستند قرار گیرد (اما در پس از هر گونه اعلام @charset).

قانون @import نیز از جستجوی رسانه‌ها پشتیبانی می‌کند، بنابراین می‌توان از وارد کردن وابسته به رسانه استفاده کرد.

مثال

مثال 1

پوشش CSS "navigation.css" را به پوشش فعلی وارد کنید:

@import "navigation.css"; /* استفاده از رشته */

یا

@import url("navigation.css"); /* استفاده از URL */

مثال 2

فقط در حالتی که رسانه print باشد، پوشش CSS "printstyle.css" وارد می‌شود:

@import "printstyle.css" print;

آزمایش کنید

مثال 3

فقط در حالتی که رسانه screen و عرض پنجره نمایش حداکثر 768 پیکسل باشد، پوشش CSS "mobstyle.css" وارد می‌شود:

@import "mobstyle.css" screen and (max-width: 768px);

آزمایش کنید

نوع وسیله CSS

@import url|string list-of-mediaqueries;

مقدار ویژگی

مقدار توضیح
url|string URL یا رشته، مکان منبع منابع مورد نظر را نشان می‌دهد. URL می‌تواند مطلق یا نسبی باشد.
list-of-mediaqueries لیست‌های جستجوی رسانه‌ای با استفاده از کاما جدا شده، شرایطی را که قوانین CSS وارد شده از طریق URL اعمال می‌شوند را تعیین می‌کنند.

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولین مرورگر هستند که این ویژگی را کامل پشتیبانی می‌کند.

Chrome IE / Edge Firefox Safari Opera
1.0 5.5 1.0 1.0 3.5