یک طراح وب

آدم ها را نمی توان فقط به یک یا چند موضوع ِ خاص، محدود ساخت. آدمی که این پشت نشسته است، از هر موضوعی می نویسد!

یک آموزش کوتاه و مهم در سی اس اس – important! چیست؟

نوشته‌ی علیرضا در April 10, 2009 روی سی اس اس
25 دیدگاه

باید در بعضی استایل ها و پرونده های سی اس اس دیده باشید که در آخر بعضی دستورات از عبارت important! استفاده می کنند. مثلا:

float: right !important;

زمانی از این عبارت استفاده می کنیم که قرار است به یک عنصر در صفحه، بیش از یک دستور بدهیم. یعنی چی؟ فرض کنید ما می خواهیم یک پوسته ای را فارسی کنیم و استایل آن را راست به چپ کنیم. روش معمول هم برای این کار این است که یک استایل جدا برای آن تهیه کنیم و فقط دستورات ِ قسمت های لازم به فارسی شدن را در آن بنویسیم. در این صورت ما برای بعضی عناصر، دو دستور متفاوت داریم. به همین خاطر برای اینکه مرورگر بفهمد الویت با کدام دستور است، در آخر دستور موردنظر یک important! می گذاریم.

برای درک این قضیه، به این مثال توجه کنید:
فرض کنید ما یک تگ p داریم که دایرکشن اش چپ به راست است:

P {
direction: ltr;
}

حالا در استایلی جدا می خواهیم آن را راست به چپ کنیم:

P {
direction: rtl;
}

حالا ما برای این تگ p دو مقدار lrt و rtl داریم. مرورگر گیج می شود که :) مقدار موردنظر ما همان rtl است پس در آخر آن، یک important! می گذاریم تا مرورگر بی چون و چرا بلافاصله rtl را روی تگ p اجرا کند:

P {
direction: rtl !important;
}

همین دیگر :)

25 دیدگاه نوشته شده است! می توانید دیدگاه خود را بنویسید »

  • مجتی در 09/04/10 گفت:

    ممنون .استفاده کردم .

  • مرتضی در 09/04/10 گفت:

    مرسی علیرضا
    به نکته ظریف و قشنگی اشاره کردی

  • علیرضا در 09/04/10 گفت:

    قابلی نداشت

  • علیرضا در 09/04/10 گفت:

    چاکریم بازم از این کارا می کنم :))

  • ali در 09/04/11 گفت:

    مرورگر خودش آخرین دستوری رو که به المنت نسبت داده باشید اعمال میکنه، دیگه نیازی به important! نیست.

  • علیرضا در 09/04/11 گفت:

    ممنون از نظرتون. من بارها به این مورد برخوردم و همیشه اینطور نیست که مرورگر آخرین دستور رو اجرا کنه. خصوصا اینکه پرونده ها جدا باشند!

  • محمدرضا در 09/04/11 گفت:

    این یعنی چی؟
    چرا ما باید دو تا تگ با یه اسم تعریف کنیم که مجبور باشیم از important استفاده کنیم؟
    کاربردی داره؟

  • علیرضا در 09/04/11 گفت:

    دوتا تگ نه دوتا سلکتور برای یک تگ. عمدا این کار رو نمیکنیم که! فرض کنید که می خواین برای یه سایتی مثل توییتر یا فرندفید استایل بنویسید با استفاده از افزونه ی استایلیش یا گریزمانکی. خب شما میاین و مقادیر ِ سلکتورهای لازم رو تغییر می دین. استایل اصلی خود سایت هم هست. پس در نتیجه ما دو یا چندتا سلکتور برای یک تگ داریم. امیدوارم منظورم رو متوجه شده باشید :)

  • شقایق در 09/04/11 گفت:

    مرسی خیلی مفید بود.

  • علیرضا در 09/04/11 گفت:

    خواهش میکنم :)

  • محمدرضا در 09/04/11 گفت:

    بله منظورتون رو متوجه شده بودم اما فکر نمیکردم کاربردی داشته باشه که با توضیحتون متوجه شدم ;)

  • علیرضا در 09/04/11 گفت:

    بسیار عالی :)

  • milad در 09/04/12 گفت:

    مطلب جالب و مفیدی بود . درضمن من بدجوری دنبال کتاب CSS For The Dummies هستم. خوشحال میشوم به سایت ما هم سری بزنید

  • sadegh در 09/04/12 گفت:

    نکته جالب و مفیدی بود
    ممنون

  • مجتبي در 09/04/13 گفت:

    سلام.
    دوست عزيز وب سايت بسيار مفيدي داريد.
    در وبلاگم لينكتون كردم.
    اگر مايل بوديد، لينكم كنيد. اگر هم اين كار رو نكرديد، مشكلي نيست.
    موفق باشيد

  • Jamshid در 09/04/20 گفت:

    اصلا استعداد توضیح دادن نداری. ممنون

  • علیرضا در 09/04/20 گفت:

    خواهش می کنم البته داشتن آی کیو ِ نسبتا بالا هم شرط ه ;)

  • علیرضا در 09/04/20 گفت:

    خواهش میکنم

  • علیرضا در 09/04/20 گفت:

    ;)

  • علیرضا در 09/04/20 گفت:

    لطف کردین ممنون :)

  • fardamm در 09/05/06 گفت:

    با توجه به فرمایش شما این که در اینجا مشاهده می کنید چه معنایی دارد ؟ آیا تغییر در این موجب تغییر در هر دو صفحه انگلیسی وفارسی می شود؟

  • علیرضا در 09/05/08 گفت:

    بله؟!

  • محمد در 09/09/17 گفت:

    آقا خیلی ممنون , خوب پاکش کنیم بهتر نمیشه !؟

    ولی بازم ممنون !

  • رضا مرندی در 09/10/25 گفت:

    سلام
    مطلبت بسیار عالی بود
    فقط یک سوال , اینکه چطور Source ها رو تو یه چیزی مثله Code Tag قزار میدی ؟
    افزونه ی خاصی داره ؟‌ چون من فکر نکنم که ویرایشگر خود وردپرس این امکان رو داشته باشه
    راستی من لینکتون کردم توی وبلاگم اگر مایل بودین شما هم بزارین لینک منو ..
    موفق و سربلند باشید ..

لطفا قبل از نوشتن دیدگاه خود، توجه داشته باشید که دیدگاه‌تان در رابطه با این پست باشد. در غیر این‌صورت می‌توانید از فرم تماس استفاده کنید. ممنون از توجه‌تان :)
my avatar

دیدگاه خود را ارسال کنید