:checked Pseudo-class
شبه کلاس checked:
در CSS، هر عنصر input
که فعال شده باشد را هدف قرار می دهد. این عناصر شامل دکمه ها و چک باکس ها هم می شوند.
در مثال زیر میبینیم که وقتی عنصر به حالت چک شده یا فعال درآید، رنگ آن تغییر یافته و قرمز می شود.
HTML
<form> <h4>جنسیت خود را انتخاب کنید:</h4> <input type="radio" value="male" id="male" name="gender"> <label for="male">مرد</label><br> <input type="radio" value="woman" id="woman" name="gender"> <label for="woman">زن</label> <h4>رنگهای مورد علاقه خود را انتخاب کنید:</h4> <input type="checkbox" id="red"> <label for="red">قرمز</label><br> <input type="checkbox" id="blue"> <label for="blue">آبی</label><br> <input type="checkbox" id="green"> <label for="green">سبز</label> </form>
css
input:checked + label { color: red; }
مشاهده و ویرایش کد بصورت تمام صفحه
پشتیبانی مرورگرها
تمام مرورگرها از این شبه کلاس در CSS پشتیبانی می کنند.