常规:

示例描述:

<div class="yo-btnbar"> <button class="yo-btn yo-btn-m">取消</button> <button class="yo-btn yo-btn-m">取消</button> <button class="yo-btn yo-btn-m">取消</button> </div> <div class="yo-btnbar"> <button class="yo-btn yo-btn-m"><i class="yo-ico">&#xf07d;</i></button> <button class="yo-btn yo-btn-m"><i class="yo-ico">&#xf07e;</i></button> <button class="yo-btn yo-btn-m"><i class="yo-ico">&#xf07f;</i></button> </div>

扩展:

假设你想要改变圆角,那么你可以这样扩展:

// 自定义一个 `yo-btnbar-test` 按钮组 @include yo-btnbar( $name: test, $radius: .1rem );

使用方法:

<div class="yo-btnbar yo-btnbar-test"> ... </div>
@include yo-btnbar(
    $name:default, //{String} 为新的扩展定义一个名称
    $radius:default //{Length} 圆角半径长度
)