css – Bootstrap 4响应按钮大小

前端之家收集整理的这篇文章主要介绍了css – Bootstrap 4响应按钮大小前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
Bootstrap 4中是否有一种方法可以在media-breakpoint-xs中添加类’btn-sm'(小按钮)?

我希望按钮是默认大小,除了在xs屏幕,我希望它们自动切换到btn-sm.

解决方法

使用media-breakpoint-mixin分配.btn .btn-sm大小调整…
/* change all .btn to .btn-sm size on xs */
@include media-breakpoint-between(xs,sm){
  .btn {
      @include button-size($btn-padding-y-sm,$btn-padding-x-sm,$font-size-sm,$btn-border-radius-sm);
  }
}

https://www.codeply.com/go/FoEUO7XCDU

更新 – Bootstrap 4 Beta
这个按钮大小的mixin略有变化:

@include media-breakpoint-between(xs,sm){
  .btn {
      @include button-size($input-btn-padding-y-sm,$input-btn-padding-x-sm,$line-height-sm,$btn-border-radius-sm);
  }
}

猜你在找的CSS相关文章