自定义按钮组

Question

我想使用粉底按钮组并拥有自己的造型，但我不知道如何设置自定义风格的选择按钮

我有这个：

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

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

如何设置＆＃34;有效＆＃34;单击的按钮样式？

Answer 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);
}