پرسش و پاسخ – شبه کلاس ها در CSS
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با پرسش و پاسخ – شبه کلاس ها در CSS با من همراه باشید.
Free-Learn
پرسش از شما، پاسخ از بنده تا جایی که بتونم و در توانم باشه، لطفا پرسش تان را فقط در رابطه با بخش مشخص شده ارسال نمایید تا نظم و ترتیب در بخش پرسش و پاسخ بخوبی رعایت شود.
برای مشاهده بخش – آموزش کامل شبه کلاس ها در CSS لطفا اینجا کلیک نمایید. .
لطفا پرسشی که ارسال مینمایید فقط مربوط به بخش [ آموزش کامل شبه کلاس ها در CSS ] باشد، در غیراینصورت پرسش شما تایید نخواهد شد.
با سلام و سپاس از سایت خوبتون
من در حال تمرین با شبه کلاس first-of-type بودم که به مورد جالبی برخورد کردم که فعلا توضیحی براش ندارم و ممنون میشم توضیح بدین…
فرض کنید چندین تگ div در صفحه داریم و درون هرکدام هم تگهای p , span , h2 زده باشیم(دقیقا شبیه مثالی که خودتون در توضیح این شبه کلاس زدین با این تفاوت که به جای یک تگ div چندتا تگ div داشته باشیم) حالا اگه من کدم رو اینجوری بنویسم: div:first-of-child{background-color: orange} (یعنی بین تگ div و علامت : فاصله ای نذارم) رنگ پشت زمینه تمام المان های اولین تگ div نارنجی رنگ میشه یعنی بین تگهای div فقط اولین تگ رو انتخاب میکنه و تمام عناصر داخلش رو تحت تاثیر قرار میده. حالا اگه من کد را به صورت div :first of child{background-color: orange} بنویسم(یعنی بین تگ div و علامت : فاصله بذارم) CSS میره و تمامی تگ هایی که اولین فرزند از یک نوع خاص هستن در داخل تمام تگهای div رو انتخاب میکنه و رنگ پشت زمینه شون نارنجی میشه(مثل مثالی که خودتون زدین)
میشه لطفا توضیح بدین که کلا تفاوت بین این دو نوع انتخابگر چی هستش و چرا به دو صورت عمل میکنن؟
باسلام و عرض ادب
بطور کلی فاصله مهمه و تاثیر گذاره در نحوه انتخاب
یعنی فاصله باشه میبینی نحوه انتخاب یجور میشه و اگه فاصله نباشه بکل جور دیگه ( یعنی اگه بین : و نام شبه کلاس فاصله بزاری بکل برنامه خراب میشه و دیگه هیچی انتخاب نمیشه )
حالا اینکه چرا کل div تحت تاثیر قرار میگیره؟ خب مشخصه، چون وقتی فاصله نباشه مثه اینه که داری میگی خوده اون div هم شامل باشه
بطور مثال بنظره شما تفاوت ۲دستور زیر چیه :
div.test
و
div .test
اولی یعنی کلاس تست داخل خوده تگ div هستش
دومی یعنی یه تگی که کلاس تست داره بعد دوباره اون تگ خودش داخل تگ div قرار داره
پس فاصله در هرجایی ممکنه تو عملکرد تاثیر بزاره
======================
حالا مثلا شما در این مثال بیا و بکل اون div (در دستورات css) رو حذف کن و بعدش اجرا کن
خب میبینی که کل صفحه تحت تاثیر قرار گرفته
چون اون بیچاره تکلیفش مشخص نیست ، میگه آقا شما باید به من بگی من برم کجا و داخل چه عنصر به دنبال عناصر نوع خاص باشم
وقتی ما براش مشخص نکنیم خب اونم کل بدنه صفحه یعنی تگ body یا حتی تگ html رو در نظر میگیره
باتشکر
ممنون بابت پاسخگویی تون