cssblog.ir logo
S

first-of-type

انتخاب‌گر اولین فرزند با درنظر گرفتن نوع

علاوه بر سلکتور first-child که در انتخاب اولین فرزند نقش دارد سلکتور first-of-type نوع عنصر را هم در هنگام انتخاب درنظر می‌گیرد

این سلکتور بسیار مشابه با first-child: عمل می‌کند و توصیه می‌کنیم قبل از مطالعه این مطلب حتما درباره آنها بخوانید. این سلکتور تنها یک تفاوت با :first-child دارد و آن هم در نظر گرفتن نوع عنصر در هنگام شمارش است.

وقتی که ما از :first-child استفاده می کنیم دیگر نوع عنصر مانند <‌p‌> یا <‌h1‌> بودن آن مهم نیست و فقط ترتیبی که به نسبت والد خود دارند مهم است. اما وقتی از :first-of-type استفاده می کنیم این چنین نیست و نوع عناصر نیز مهم می شود.

مثال: تفاوت :first-child و :first-of-type را در این مثال می‌توان مشاهده نمود 

همانطور که مشاهده می کنید اولین پاراگراف خود اولین فرزند نیست اما با استفاده از این سلکتور آن را انتخاب کرده‌ایم. زیرا اگر سلکتور first-child با عنصری مطابقت داشت باید رنگ آن قرمز رنگ می‌شد.

دیدگاه کاربران

تاکنون <% totalComments %> دیدگاه برای این مطلب ثبت شده است.

تاکنون دیدگاهی ثبت نشده است. شما می توانید اولین شخصی باشید که دیدگاه خود را ارسال می کند

<% errorMessage %>

<% comment.name %>

avatar
<% comment.comment_replies.length %> پاسخ برای این دیدگاه ثبت شده است

<% reply.name %>

avatar

ارسال دیدگاه جدید

برای ارسال دیدگاه یا پرسش جدید از طریق فرم زیر اقدام کنید.

ارائه پاسخ به دیدگاه

شما در حال پاسخ دادن به دیدگاه «<% replyComment.name %>» هستید. انصراف از پاسخ

  • <% s %>
  • <% e %>

نکاتی درباره دیدگاه ها

  1. برای حذف کپچا (عبارت امنیتی) وارد اکانت خود شوید
  2. شما می توانید از markdown داخل کامنت خود استفاده کنید (اطلاعات بیشتر)
  3. دیدگاه ها قبل از نمایش نیازمند تائید می باشند