我想使用基础按钮组并拥有自己的样式,但我不知道如何设置所选按钮的自定义样式
我有这个:
.format-button-group {
@include button-group-container(
$styles:true
);
.format-group { @include button; }
}
如何为被点击的按钮设置“事件”按钮样式?
最佳答案
你可以用 radio 组来做到这一点 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);
}
关于css - 自定义按钮组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24745252/