Created
June 25, 2013 17:51
-
-
Save cynazem/5860639 to your computer and use it in GitHub Desktop.
Checkbox and Radio buttons (image replacement)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* CHECKBOX & RADIOS */ | |
/*********************/ | |
input[type="radio"], input[type="checkbox"] {display: none} | |
input[type="radio"] + label,input[type="checkbox"] + label {display: block; padding-left: 20px; min-height: 18px; margin-bottom: 5px; cursor: pointer;} | |
input[type="checkbox"] + label {background: url(../images/ico-checkbox-normal.png) left top no-repeat} /* checkbox normal */ | |
input[type="checkbox"] + label:hover {background: url(../images/ico-checkbox-hover.png) left top no-repeat} /* checkbox normal + hover */ | |
input[type="checkbox"] + label:active {background: url(../images/ico-checkbox-active.png) left top no-repeat} /* checkbox clicado */ | |
input[type="checkbox"]:checked + label{background: url(../images/ico-checkbox-checked.png) left top no-repeat} /* checkado + hover */ | |
input[type="checkbox"]:checked + label:active {background: url(../images/ico-checkbox-active.png) left top no-repeat} /* checkbox checkado clicado */ | |
input[type="checkbox"]:checked + label:hover {} /* checkbox normal checado + hover */ | |
input[type="checkbox"]:disabled + label {background: url() left top no-repeat} /* checkbox normal desabilitado */ | |
input[type="checkbox"]:disabled:checked + label {background: url() left top no-repeat}/* checkbox checado desabilitado */ | |
input[type="radio"] + label {background: url(../images/ico-radio-normal.png) left top no-repeat} /* radio normal */ | |
input[type="radio"] + label:hover {background: url(../images/ico-radio-hover.png) left top no-repeat} /* radio normal + hover */ | |
input[type="radio"] + label:active {background: url(../images/ico-radio-active.png) left top no-repeat} /* radio clicado */ | |
input[type="radio"]:checked + label{background: url(../images/ico-radio-checked.png) left top no-repeat} /* radio + hover */ | |
input[type="radio"]:checked + label:active {background: url(../images/ico-radio-active.png) left top no-repeat} /* radio checkado clicado */ | |
input[type="radio"]:checked + label:hover {} /* radio normal checado + hover */ | |
input[type="radio"]:disabled + label {background: url() left top no-repeat} /* radio normal desabilitado */ | |
input[type="radio"]:disabled:checked + label {background: url() left top no-repeat} /* radio checado desabilitado */ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment