Ahri-NineTailFox
4/24/2017 - 6:52 AM

@media Screen | - MediaScreenMax-width - MixinsMediaScreen

@media Screen |

  • MediaScreenMax-width
  • MixinsMediaScreen
$xs: 415px;
$sm: 481px;
$md: 979px;
$lg: 1250px;

/* @include media (xs){ // css code for xs screens go here } */
@mixin media($size) {
    @media screen (max-width: #{$size}) {
        @content;
    }
}
/* @include xs { // css code for xs screens go here } */

@mixin xs() {
    @media screen (max-width: 415px) {
        @content;
    }
}

@mixin sm() {
    @media screen (max-width: 481px) {
        @content;
    }
}

@mixin md() {
    @media screen (max-width: 979px) {
        @content;
    }
}

@mixin lg() {
    @media screen (max-width: 1250px) {
        @content;
    }
}
@media screen (max-width: 1250px) {

}
@media only screen and (max-width: 1250px) {

}