Skip to content

Instantly share code, notes, and snippets.

@timplunkett
Created March 12, 2011 23:33
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save timplunkett/867699 to your computer and use it in GitHub Desktop.
Save timplunkett/867699 to your computer and use it in GitHub Desktop.
Interpolation and foreach
// Sass
$selectors: {foo, bar, baz};
foreach $selectors as $selector {
.#{$selector} { background-image: url("../images/#{$selector}/background.png"); }
}
// CSS
.foo {
background-image: url("../images/foo/background.png");
}
.bar {
background-image: url("../images/bar/background.png");
}
.baz {
background-image: url("../images/baz/background.png");
}
@nex3
Copy link

nex3 commented Mar 14, 2011

This is supported in Sass 3.1. The syntax is:

$selectors: foo, bar, baz;
@each $selector in $selectors {
  .#{$selector} { background-image: url("../images/#{$selector}/background.png");
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment