너무 많은 코드를 사용하지 않고도 아름다운 체크박스를 쉽게 사용자 정의하고 하이퍼링크_HTML/Xhtml_웹페이지 제작을 사용할 수 있습니다.

오늘 문득 HTML의 체크박스는 변경할 수 있는 스타일이 제한되어 있다는 생각이 들었고, 이제 체크박스를 만들려면 많은 코드를 작성해야 한다는 생각이 들었고, 그러다가 간단한 구현을 생각해냈습니다. 이것이 가능하다는 것이 완전히 입증되었습니다. 말할 것도 없이 그냥 참고용으로 소스 코드를 게시하세요.

효과:

선택하지 않은 경우: 선택한 경우:

사진 배경:

checkboxSel.jpg

checkboxNoSel.jpg

코드:

html 코드 조각:

코드 복사

코드는 다음과 같습니다.

< ;/ a> 월요일

javaScript 코드 조각:

코드 복사

코드는 다음과 같습니다. 다음과 같습니다:

$("a[name='checkWeek']").click(function(){
if($(this).hasClass('divCheckBoxSel')){
$( this).removeClass('divCheckBoxSel');
}else{
$(this).addClass('divCheckBoxSel')
}
}); 🎜>
CSS 코드 조각:

코드 복사 코드는 다음과 같습니다.

.divCheckBoxNoSel{

배경: url("../image/checkboxNoSel.jpg") 반복 없음 중앙
float:left
width:15px
height:15px; ;
테두리:1px 솔리드 #BDBDBD;
색상:#FFF;
}
.divCheckBoxSel{
배경: url("../image/checkboxSel.jpg") 반복 없음 중앙 중앙;
폭:15px;
테두리:1px
색상:#FFF; 🎜>
각자 구별하기 하이퍼링크는 여러 가지 방법으로 설명되지 않습니다. 사실 유사한 라디오 버튼 버튼도 이런 방식으로 쉽게 구현할 수 있으므로 시간이 절약됩니다.