skip navigation

Checkbox/Radio(디자인)

Checkbox(기본)

[VIEW]

[CODE]
<!-- 기본 --> <span class="chk_wrap"> <input type="checkbox" name="fn_ck_xx" id="fi_ck_xx1"><label for="fi_ck_xx1">테스트 1</label> </span> <span class="chk_wrap"> <input type="checkbox" name="fn_ck_xx" id="fi_ck_xx4" checked="checked"><label for="fi_ck_xx4">테스트 4</label> </span> <span class="chk_wrap"> <input type="checkbox" name="fn_ck_xx" id="fi_ck_xx5" disabled="disabled"><label for="fi_ck_xx5">테스트 5</label> </span> <span class="chk_wrap"> <input type="checkbox" name="fn_ck_xx" id="fi_ck_xx6" disabled="disabled"><label for="fi_ck_xx6">테스트 6</label> </span> <!-- Checkbox 가 right 방향에 있는 case --> <span class="chk_wrap ar"> <input type="checkbox" name="fn_ck_xx_r" id="fi_ck_xx_r1"><label for="fi_ck_xx_r1">테스트 1</label> </span>

Checkbox(label이 없는 경우)

[VIEW]
[CODE]
<span class="chk_wrap"> <input type="checkbox" name="fn_ck_xxxx" id="fn_ck_xxxx1"><label for="fn_ck_xxxx1"><span class="hide">label 없는 예제 1</span></label> </span>

Radio(기본)

[VIEW]

[CODE]
<!-- 기본 --> <span class="rad_wrap"> <input type="radio" name="fn_rd_xx" id="fi_rd_xx1"><label for="fi_rd_xx1">테스트 1</label> </span> <span class="rad_wrap"> <input type="radio" name="fn_rd_xx" id="fi_rd_xx2" checked="checked"><label for="fi_rd_xx2">테스트 2</label> </span> <span class="rad_wrap"> <input type="radio" name="fn_rd_xx" id="fi_rd_xx3" disabled="disabled"><label for="fi_rd_xx3">테스트3</label> </span> <span class="rad_wrap"> <input type="radio" name="fn_rd_xx" id="fi_rd_xx4" checked="checked" disabled="disabled"><label for="fi_rd_xx4">테스트4</label> </span> <!-- Radio 가 right 방향에 있는 case --> <span class="rad_wrap ar"> <input type="radio" name="fn_rd_xx_r1" id="fi_rd_xx_r1"><label for="fi_rd_xx_r1">테스트 1</label> </span>

Radio(label이 없는 경우)

[VIEW]
[CODE]
<span class="rad_wrap ui_radiobox"> <input type="radio" name="fn_rd_namexx2" id="fi_rd_idxx11"><label for="fi_rd_idxx11"><span class="hide">label 없는 예제 1</span></label> </span>