css 循环变量

@for $i from 10 through 50 {
  .m#{$i} {
    margin: #{$i}px !important ;
  }

  .mt#{$i} {
    margin-top: #{$i}px !important ;
  }

  .mb#{$i} {
    margin-bottom: #{$i}px !important ;
  }

  .ml#{$i} {
    margin-left: #{$i}px !important ;
  }

  .mr#{$i} {
    margin-right: #{$i}px !important ;
  }
  .p#{$i} {
    padding: #{$i}px !important ;
  }

  .pt#{$i} {
    padding-top: #{$i}px !important ;
  }

  .pb#{$i} {
    padding-bottom: #{$i}px !important ;
  }

  .pl#{$i} {
    padding-left: #{$i}px !important ;
  }

  .pr#{$i} {
    padding-right: #{$i}px !important ;
  }
}

@for $i from 12 through 35 {
  .f#{$i} {
    font-size: #{$i}px !important ;
  }
}