Generated by SassMeister.com.

SassMeister-input.scss

// ----
// libsass (v3.2.4)
// ----

$image-sizes: (400, 600, 800);

/* @for loop */
html
{
  background-image: url("background.#{nth($image-sizes, 1)}.jpg");
}
    
@for $i from 2 through length($image-sizes)
{
  @media(min-width: #{nth($image-sizes, $i)}px)
  {
    html
    {
      background-image: url("background.#{nth($image-sizes, $i)}.jpg");
    }
  }
}

/* @each loop */
@each $image-size in $image-sizes
{
  @if $image-size == nth($image-sizes, 1)
  {
    html { background: url("background-image.#{$image-size}.jpg"); }
  }
  @else
  {
    @media(min-width: #{$image-size}px)
    {
      html { background: url("background-image.#{$image-size}.jpg"); }
    }
  }
}

SassMeister-output.css

/* @for loop */
html {
  background-image: url("background.400.jpg");
}

@media (min-width: 600px) {
  html {
    background-image: url("background.600.jpg");
  }
}

@media (min-width: 800px) {
  html {
    background-image: url("background.800.jpg");
  }
}

/* @each loop */
html {
  background: url("background-image.400.jpg");
}

@media (min-width: 600px) {
  html {
    background: url("background-image.600.jpg");
  }
}

@media (min-width: 800px) {
  html {
    background: url("background-image.800.jpg");
  }
}