이미지가있는 라디오 버튼을 만드는 방법

Question

텍스트 대신 라디오 버튼이 있어야합니다. 그래서 남성과 여성의 텍스트 대신 남성과 여성의 이미지를 갖고 싶습니다. 이 작업은 표준 HTML을 사용하여 실제로 수행 할 수 있습니까, 아니면 jQuery를 사용해야합니까? 어떻게해야합니까?

Answer 1

사용 <label> 요소를 다음과 같이 이미지를 호스트 :

<input type="radio" name="sex" value="male" id="male-radio"> 
<label for="male-radio"><img src="male.gif"></label> 

<input type="radio" name="sex" value="female" id="female-radio"> 
<label for="female-radio"><img src="female.gif"></label> 

근무 예 : http://jsfiddle.net/RichieHindle/vQwCF/