모바일 체크박스 변경 마크업

by 조쉬 posted Feb 03, 2015
?

단축키

Prev이전 문서

Next다음 문서

ESC닫기

크게 작게 위로 아래로 댓글로 가기 인쇄
input[type='checkbox'] {
    background
: #fff;
    border
: solid 2px #AD2A1A;
    height
: 24px;
    width
: 24px;
   
-webkit-appearance: none;
   
-webkit-border-radius: 4px;
}

input
[type='checkbox']:checked {
    background
: #fff;
    border
: solid 2px #ADABA8;
}

input
[type='checkbox']:checked:after {
    content
: ' ';
    display
: block;
    width
: 14px;
    height
: 14px;
    background
: #C9C7C5;
    position
: relative;
    top
: 3px;
    left
: 3px;
   
-webkit-border-radius: 2px;
}