2014-07-14 2 views
1

나는 기초 버튼 그룹을 사용하고 내 자신의 스타일을 갖고 싶어하지만, 나는이 가지고있는 사용자 정의 스타일 적 선택 버튼사용자 정의 버튼 그룹

설정하는 방법을 모른다 :

.format-button-group { 
    @include button-group-container(
    $styles:true 

); 
    .format-group { @include button; } 
} 

을 클릭 한 스타일에 대해 "활성"버튼 스타일을 설정하려면 어떻게해야합니까?

답변

1

당신은 라디오 그룹으로 작업을 수행 할 수 있습니다 http://jsfiddle.net/vDyK2/

HTML :

<ul class="button-group round"> 
    <li> 
     <input type="radio" id="btn1" name="btn"> 
     <label for="btn1" class="small button secondary">Ipsum</label> 
    </li> 
    <li> 
     <input type="radio" id="btn2" name="btn"> 
     <label for="btn2" class="small button secondary">Dolor</label> 
    </li> 
    <li> 
     <input type="radio" id="btn3" name="btn"> 
     <label for="btn3" class="small button secondary">Sit amet</label> 
    </li> 
</ul> 

CSS :

input[type="radio"]{ 
    display:none; 
    position:absolute; 
} 
.small.button.secondary{ 
    margin:0; 
} 
input[type="radio"]:checked + label{ 
    background-color: rgb(0, 114, 149); 
}