[HTML/CSS] 체크박스 커스텀

HTML

<!-- 전체동의 체크박스 -->
<input type="checkbox" name="agree_all" id="agree_all" value="checkbox_all" onClick="selectAll(this);">
<!-- 개별 체크박스 -->
<input type="checkbox" class="checked" name="agree" id="agree1" value="checkbox1" tabindex="4" onclick="selectOne();">
<input type="checkbox" class="checked" name="agree" id="agree2" value="checkbox1" tabindex="4" onclick="selectOne();">
<input type="checkbox" class="checked" name="agree" id="agree3" value="checkbox1" tabindex="4" onclick="selectOne();">
<input type="checkbox" class="checked" name="agree" id="agree4" value="checkbox1" tabindex="4" onclick="selectOne();">

 

CSS

input[type="checkbox"] {
	appearance: none;
	width: 26px;
	height: 26px;
	background: url(../../images/common/check_default.png) no-repeat;
	cursor: pointer;
}

input[type="checkbox"]:checked {
	background-image: url(../../images/common/check_checked.png);
}