جشنواره عیدانه راکت | عضویت ویژه راکت برای آخرین بار | افزایش قیمت‌ها از سال جدید | و ...

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

آشنایی با سلکتورها در CSS - بخش دوم

2- سلکتورهای ترکیبی

این سلکتورها شامل چهار دسته زیر می شوند:
descendant selector (space)
child selector (>)
adjacent sibling selector (+)
general sibling selector (~)

Descendant Selector

این سلکتور تمامی عناصر فرزند داخل خود را چه در سطح یک چه در سطح دو و … را انتخاب می کند. هم فرزندان هم نوه ها نبیره ها و … را انتخاب می کند.
در مثال زیر تمامی عناصر p که در داخل تگ div والد خود هستند چه فرزندان و چه نوه ها انتخاب می شوند:

Descendant Selector

Child Selector

این سلکتور تمامی عناصری که فرزند مستقیم تگ والد خود هستند را انتخاب می کند.
در این مثال تمام تگ های p که فرزند مستقیم و فرزند سطح اول تگ div هستند انتخاب می شوند:

Child Selector

Adjacent Sibling Selector

این سلکتور تمامی تگ هایی که بلافاصله بعد از تگ هم سطح و به اصطلاح sibling خود می آیند را انتخاب می کند. اصطلاح سیبلینگ به معنی هم سطح و همچنین خواهر برادری نیز گفته می شود چون هر دو در یک سطح هستند و هر دو فرزندان مستقیم یک والد می باشند.
در این مثال تگ پی ای که بلافاصله بعد از تگ دیو آمده است انتخاب می شود. همان طور که توجه می کنید دو تگ پی آخر هم سطح و سیبلینگ تگ دیو هستند و از بین این دو تگ پی فقط تگ پی اول که بلافاصله بعد از تگ دیو آمده است انتخاب می شود:

Adjacent Sibling Selector

General Sibling Selector

این سلکتور تمامی عناصری را که بعد از عنصر هم سطح خود می آیند را انتخاب می کند.
در این مثال دو تگ پی که بعد از تگ دیو هم سطح خود آمده اند انتخاب شده اند. توجه داشته باشید که مهم نیست این تگ ها چگونه بعد از تگ دیو آمده اند. همان طور که می بینید یک تگ code بین دو تگ پی آمده است ولی با این وجود مانع انتخاب تگ پی دوم نشده است:

General Sibling Selector


ثبت پرسش جدید
فرهاد
تخصص : Javascript Developer
@cfarhad 4 سال پیش مطرح شد
0

@Astaneh خیلی عالی و خوب ولی فک کنم اگه مطلبی چیزی دارید ادمین راکت شید @hesammousavi


محسن آستانه
تخصص : عاشق طراحی وب و برنامه نویسی
@Astaneh 4 سال پیش مطرح شد
0

نه واللا من صرفا از روی اشتیاق و همچنین بخاطر به اشتراک گذاشتن چیزهایی که بلد هستیم این مطالب رو درج میکنم و بیشتر از اونی که بخوام یاد بدم خودم باید از دوستان یاد بگیرم! تنها هدفم همین هست. مطمینا اگه چیزهایی که بلد هستیم رو بهم یاد بدیم نه تنها این سایت و خودمون که مملکتمون پیشرفت می کنه. مشکل ما این هست که دوس نداریم مطالبی رو که یاد داریم با دیگران به اشتراک بزاریم. چکاریه؟! به دیگران یاد بدم که اونا ازم جلو بزنن؟!! این تفکر اکثر ما ایرانی هاست و علت عقب افتادگیمون هم همین هست.


حسام موسوی
تخصص : طراح و برنامه نویس
@hesammousavi 4 سال پیش مطرح شد
1

سپاس از اینکه این مطلب رو به اشتراک گذاشتید


محسن آستانه
تخصص : عاشق طراحی وب و برنامه نویسی
@Astaneh 4 سال پیش مطرح شد
0

خواهش می کنم. تشکر از شما


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام