برنامه نویسی

آموزش تعیین اولویت برای استایل به کمک قابلیت !important در CSS

آموزش تعیین اولویت برای استایل به کمک قابلیت !important در CSS

important در CSS چیست؟ با توجه به قوانین CSS آخرین کد های نوشته شده همواره اجرا می شوند (اولویت با آخرین کد ها است) اما بعضی اوقات هم هست که ما نیاز داریم این قوانین را نقض کنیم به همین خاطر مجبور میشویم از important در CSS استفاده کنیم. ما در این مقاله قصد داریم قابلیت important در CSS را به طور کامل آموزش دهیم، همراه داتیس نتورک باشید.

آموزش تعیین اولویت برای استایل به کمک قابلیت !important در CSS

important در CSS چیست؟

از important برای افزودن اهمیت به ویژگی و یا مقدار استفاده می شود.

در حقیقت اگر از important در CSS استفاده کنید، این قانون همه قوانین قبلی را برای یک خاصیت خاص روی آن عنصر نادیده می گیرد، یعنی اولویت را با آن قرار می دهد.

مثال:

#myid {
background-color: blue;
}

.myclass {
background-color: gray;
}

p {
background-color: red !important;
}

همان طور که مشاهده کردید در مثال بالا هر سه پاراگراف رنگ زمینه قرمز خواهند داشت.

حتی اگر ID و سلکتور class از ویژگی بالاتری برخوردار باشند. important در هر دو مورد خاصیت رنگ پس زمینه را نادیده می گیرد.

مهم درباره important 

تنها راه برای نادیده گرفتن importent در CSS این است که یک important دیگر خط بعدی نام ببریم یعنی اگر بیش از یک important داشته باشیم آن که اخر است بیشترین اولویت را دارد.

مثال:

#myid {
background-color: blue !important;
}

.myclass {
background-color: gray !important;
}

p {
background-color: red !important;
}

خوب همان طور که در مثال بالا مشاهده کردید رنگ پس زمینه قرمز است و دلیل آن این است که در خط اخر کد ها قرار دارد.

مثال استفاده از important

برای مثال یک فایل CSS خارجی دارید و به کدهای این فایل دسترسی ندارید، ولی خب میخواهید دستور CSS دلخواه خودتون را بر روی دستورات موجود در فایل خارجی اعمال کنید

برای مثال :

در فایل خارجی رنگ متن تگ p آبی است ولی خب شما میخواهید قرمز باشد، پس خیلی راحت از دستور Important استفاده میکنیم.

امیدواریم این مقاله برایتان مفید بوده باشد.

داتیس نتورک را در شبکه های اجتماعی دنبال کنید.

مطالب مرتبط

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *