default:

default یک pseudo-class است که از آن برای انتخاب عنصر پیشفرض در بین یک گروه از عناصر همجنس مورد استفاده قرار می گیرد.

عناصر زیر می توانند حالت پیشفرض یا default داشته باشند که در نتیجه در CSS می توان این عناصر را توسط انتخابگر :default هدف قرار داد:

– آیتم های موجود در context menu

– عناصر button

– آیتم های عنصر select

– آیتم پیشفرض عنصر menu از نوع pop-up

– دکمه های چک باکس و رادیو که ویژگی checked داشته باشند

دکمه submit پیشفرض

– عناصر option در یک select که دارای ویژگی selected هستند

به عنوان نمونه در عناصر زیر آیتم آخر می تواند توسط این انتخابگر انتخاب شود:

 


<select>
  <option value=""></option>
  <option value=""></option>
  <option value=""></option>
  <option value="" selected></option>
</select>

 

 


option:default {
   color: yellow;
   font-style: italic;
}

 

نمونه های دیگری از استفاده این انتخابگر در ادامه آمده است:

 


button:default {
  border: 1px dotted #009966;
}

input[type="submit"]:default {
  color: green;
}

input[type="checkbox"]:default + label {
  text-decoration: line-through;
}

 

در دموی زیر ویژگی های عناصر فرم را با دقت بررسی کنید:

 

See the Pen :default by Mojtaba Seyedi (@seyedi) on CodePen.

 

 

پشتیبانی مرورگر ها

انتخابگر :default در کروم +10 , فایرفاکس +4, سافاری +5 , اپرا +10 و +5 iOS پشتیبانی می شود.

اینترنت اکسپلورر به هیچ عنوان این انتخابگر را پشتیبانی نمی کند و اندروید پشتیبانی ناقصی دارد.

متاسفانه فعلا مرورگرهای متفاوت رفتارهای متفاوتی در مورد عناصر متفاوت برای این انتخابگر از خود نشان می دهند :)

برای بررسی دقیق پشتیبانی مرورگرها و بررسی تفاوت های هریک به این آدرس مراجعه کنید.

یک دیدگاه برای “default:

  1. سلام جناب سیدی عزیز
    میشه بفرمایید که تفاوت بین سودوکلاس :checked و :default به طور خاص در مورد ورودی های از نوع چک باکس چی هست؟

سوال داری؟ برو به پنل پرسش و پاسخ

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *