سی ایس ایس کی نکاسی چنار

انتخاب‌کننده مشتق

با تعریف استایل بر اساس رابطه محیطی علامت در موقعیت خود، می‌توانید برچسب‌ها را ساده‌تر کنید.

در CSS1، انتخاب‌کننده‌هایی که به این روش برای اعمال قوانین استفاده می‌شوند، انتخاب‌کننده‌های محیطی (contextual selectors) نامیده می‌شوند، زیرا آنها برای اعمال یا اجتناب از یک قانون به رابطه محیطی وابسته هستند. در CSS2، آنها به عنوان انتخاب‌کننده‌های مشتق نامیده می‌شوند، اما مهم نیست که شما آنها را چگونه نامگذاری کنید، عملکرد آنها مشابه است.

انتخاب‌کننده مشتق به شما اجازه می‌دهد تا بر اساس رابطه محیطی مستند، استایل یک برچسب را تعیین کنید. با استفاده مناسب از انتخاب‌کننده مشتق، می‌توانیم کد HTML را تمیزتر کنیم.

مثلاً، اگر می‌خواهید علامت قوی در لیست به صورت ایتالیک باشد، نه به صورت قوی معمولی، می‌توانید این‌گونه یک انتخاب‌کننده مشتق تعریف کنید:

li strong {
    font-style: italic;
    font-weight: normal;
  }

لطفاً رابطه محیطی کد آبی علامت <strong> را توجه کنید:

<p><strong>من به صورت قوی هستم، نه به صورت ایتالیک، زیرا من در لیست نیستم، بنابراین این قانون برای من کار نمی‌کند</strong></p>
<ol>
<li><strong>من به صورت ایتالیک هستم. این به این دلیل است که علامت قوی در داخل علامت li قرار دارد.</strong></li>
<li>من یک فونت عادی هستم.</li>
</ol>

در مثال بالا، فقط استایل متن علامت li علامت قوی به صورت ایتالیک است، لازم نیست برای علامت قوی class یا id خاصی تعریف کنید، کد ساده‌تر خواهد بود.

دراصل نیچے دیکھیئے گئی سی ایس ایس ضابطے:

strong {
     رنگ: قرمز;
     }
h2 {
     رنگ: قرمز;
     }
h2 strong {
     رنگ: بلیو;
     }

ایک دوسرے میں اس کا اثر دینا آئیگا:

<p>اس پیراگرف میں مضبوط طور پر زور دیئے گئے لفظ <strong>قرمز</strong> ہے.</p>
<h2>اس ذیلی سرلیک کا سرلیک بھی قرمز ہے.</h2>
<h2>اس ذیلی سرلیک میں مضبوط طور پر زور دیئے گئے لفظ<strong>بلیو</strong>.</h2>

ملازمات

اگر آپ کو نکاسی چنار کے بارے میں مزید معلومات حاصل کرنا چاہئیں تو، کدوو3 سی کمپلکس کے اعلی تعلیمات میں درج ذیل مواد کو پڑھیئے: