Is it possible to style parents of a certain element type in SASS?

I want to do this:

.classname {
  color: red

  a& {
    color: blue;
  }
}

and for it to compile to:

.classname {
   color: red;
}

a.classname {
   color: blue;
}

Is there syntax available to support this? I have tried using a&, #{a&} and the compass function #{append-selector("a", "&")} but they don't compi开发者_开发知识库le, a & does, but results, obviously, in a .classname rather than a.classname.

---

I tried thinking through various options that would let you do this, but I can only come back with "why"? What's the use case, and why do you need to do this vs something else that achieves the same result as what you'd like to do.

---

I wasn't able to find a solution for tags but in this specific case you can use &[href]. It's slower but it's actually more precise (some <a> tags might not be links.)

Hopefully soon we'll be able to use &:any-link (What's the :any-link pseudo-class for?) but it's not supported by browsers yet

---

This isn't really possible with the nested syntax for SASS. From the SASS reference:

The inner rule then only applies within the outer rule’s selector.

Nested rules are syntactical sugar that makes CSS's descendent selectors easier to write, since they're one of the most common CSS constructs. While it's be nice to use your approach for writing that kind of rule, it's not what the syntax is designed (or defined) to do.