scss 响应性的混合

Posted 2021-05-17

@mixin responsive($maxWidth) {
    @media only screen and (max-width: $maxWidth) {
        @content;
    }
}

@mixin responsive-min($minWidth) {
    @media only screen and (min-width: $minWidth) {
        @content;
    }
}

@mixin responsive-min-max($minWidth, $maxWidth) {
    @media only screen and (min-width: $minWidth) and (max-width: $maxWidth) {
        @content;
    }
}