scss Bootstrap响应式排版

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了scss Bootstrap响应式排版相关的知识,希望对你有一定的参考价值。

$font-multipliers: ( md: 0.9, sm: 0.8, xs: 0.75);
@mixin font-size($font-size-var) {
    @each $key,
    $val in $font-multipliers {
        @media only screen and (max-width: map-get($grid-breakpoints, $key)) {
            font-size: $font-size-var * $val;
        }
    }
}

h1 {
    @include font-size($h1-font-size);
}

h2 {
    @include font-size($h2-font-size);
}

h3 {
    @include font-size($h3-font-size);
}

h4 {
    @include font-size($h4-font-size);
}

h5 {
    @include font-size($h5-font-size)
}

h6 {
    @include font-size($h6-font-size)
}

p,
li,
span,
.btn {
    @include font-size($font-size-base)
}

以上是关于scss Bootstrap响应式排版的主要内容,如果未能解决你的问题,请参考以下文章