09902090383

09337734689

تهران، خیابان شریعتی، خیابان معلم

resume.webbyme.ir

تلگرام طراحی سایت وب من

09902090383

09127363007

Top

آشنایی با enabled: در CSS

آشنایی با :enabled در CSS

آشنایی با enabled: در CSS


enabled:

امروز می خواهیم با enabled: آشنا بشویم، طبق توضیحاتی که در پست قبلی گفتیم :enabled هم از شبه کلاس ها است.

این شبه کلاس در عناصری را انتخاب می کند که قابل فوکوس باشند یعنی حالتی که بتوانیم داده را انتخاب، وارد و یا کلیک کنیم و بدین ترتیب بعد از انتخاب شدن این کلاس در حالت فعال قرار می گیرد.

این شبه کلاس اغلب در عناصر مربوط فرم ( <input>, <select>, <textarea> ) استفاده می شود.

برای مثال وقتی input از نوع checkbox انتخاب می شود ( در حالت چک قرار می گیرد ) با استفاده از enabled: می توانید بلافاصله آن را انتخاب کنید.

CSS


input:enabled + label {
color: #333;
font-style: italic;
}

در مثال بالا اگر checkbox در حالت فعال ( enable ) باشد متن checkbox بعد از انتخاب شدن italic و رنگ آن خاکستری تیره خواهد شد.

با توجه به تعریف تئوری شبه کلاس ها، enabled: با تگ های دارای ویژگی های href ( <a>, <area>, <link> مثل ) مطابقت دارد ولی مرورگر این متن را نمی خواند.

برای استایل دادن به تگ های <button>, <input>, <textarea>, <optgroup>, <option> , <fieldset> اگر که در حالت disabled نباشند می توانید از enabled: استفاده کنید. تگ <menu> هم در حالتی پشتیبانی می شود که در حالت disabled نباشد و سپس باید بتوانیم تگ های <command> و <li> را که childهای منو هستند را انتخاب کنیم.

هم چنین می توانید عناصر با ویژگی های contenteditable و tabindex را با شبه کلاس enabled:  فعال کنید.

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

Chrome Safari Firefox Opera IE Android iOS
All 3.1 All 9 9 All All

مقالات مرتبط

:disabled

pseudo selector

مطالعه بیشتر

CSS :enabled Selector

:enabled

هیچ نظری وجود ندارد

ارسال نظر

CommentLuv badge