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