این آموزش در تاریخ ۱۴۰۰/۱۰/۱۵ آپدیت شده است.
آموزش شبه کلاس Optional در CSS
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش شبه کلاس Optional در CSS با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
شبه کلاس Optional در CSS
با استفاده از شبه کلاس ( یا هم انتخابگر ) optional در CSS میتوان تگ هایی را که از صفت required استفاده نکردن رو انتخاب و براشون استایل دلخواه تعریف کرد.
با استفاده از شبه کلاس required دقیقا برعکس شبه کلاس optional میتوان تگ هایی که از صفت required استفاده کردن رو انتخاب کرد.
با استفاده از صفت required به راحتی میتوان مشخص کرد که یک Input حتما باید مقدار داشته باشه تا فرم بتونه ارسال شه در غیراینصورت از ارسال فرم جلوگیری میکنه
| نسخه | CSS3 |
|---|
Free-Learn
مثال از شبه کلاس Optional در CSS
در ادامه میتوانید یک مثال از این انتخابگر / شبه کلاس را در زبان CSS مشاهده نمایید.
مثال شماره ۱ : استفاده از شبه کلاس Optional و Required
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<style> input[type="text"]:optional{ background-color:#8AC007; color:#fff; } input[type="text"]:required{ background-color:#F44336; color:#fff; } </style> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از انتخابگر / شبه کلاس optional در CSS پشتیبانی میکنند یا خیر.
| نام انتخابگر | Chrome | Firefox | Opera | Safari | Edge |
| optional: | بله | بله | بله | بله | بله |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این انتخابگر / شبه کلاس در CSS بصورت زیر می باشد.
|
1 2 3 |
:optional { دستورات سی اس اس در اینجا } |
Free-Learn
نکات و توضیحات
- این شبه کلاس بروی Input ها و تگ Select و تگ Textarea عمل میکند.
- اگه یک تگ از صفت required استفاده کرده باشه خب میشه شبه کلاس required و اگه استفاده نکرده باشه میشه شبه کلاس optional
