부트 스트랩에서 이미지를 버튼으로 사용할 수 있습니까?

Question

부트 스트랩에서 토글 기능을 사용하려고하지만 기본 버튼을 이미지로 바꾸고 싶습니다. 이미지에 "이번 주"라는 텍스트가 있습니다. 그 옆에있는 단추는 "모든 시간"이라고 표시된 이미지입니다. 이 작업을 수행하는 방법에 대한 아이디어가 있습니까?

당신은 웹 페이지가 여기에 배치 볼 수 있습니다

: 당신은 당신이 예 라디오 버튼과 같은 이미지를 원하는 의미 http://matthewtbrown.com/test/imageasbutton/

<div class="btn-group" data-toggle="buttons"> 
<label class="btn btn-primary active thisweek"> 
<input type="radio" name="options" id="option1" autocomplete="off" checked> Radio 1  (preselected) 
</label> 
<label class="btn btn-primary"> 
<input type="radio" name="options" id="option2" autocomplete="off"> Radio 2 
</label> 

</div> 

rightcolumn .btn-group .btn .btn-primary .active .thisweek { 
background-image: url(../images/callout.png); 
background-color: transparent; 
} 

Answer 1

?

희망이 도움이 :

<style> 
/*input[type=radio] { 
    display: none; 
}*/ 
</style> 

<div class="btn-group" data-toggle="buttons"> 
<label class="btn btn-primary active thisweek"> 
<input type="radio" name="options" id="option1" autocomplete="off" checked><img src="https://placehold.it/200x200"> 
</label> 
<label class="btn btn-primary"> 
<input type="radio" name="options" id="option2" autocomplete="off"><img src="https://placehold.it/150x150"> 
</label> 

의 주석 스타일이 라디오 버튼 그래픽을 숨길 수 :