SASS/SCSS: Refer to property without using an inte

2019-01-18 23:28发布

问题:

Is it possible to refer to a property previously defined in a selector without introducing an intermediate variable?

I'd like to say something like:

.foo {
  padding: 15px;
  width: 300px - $padding;
}

I know that $padding syntactically looks for a defined variable, I only use it in the above example to illustrate what I want to achieve in functionality.

The above example would be equivalent to this:

.foo {
  $padding: 15px;
  padding: $padding;
  width: 300px - $padding * 2;
}

回答1:

No, you can't, and it would be great.

I haven't tested, but as far as I know the only css pre-processor that can do that is stylus. Look at the variable section in its documentation, where it says Property Lookup. It works that way:

.foo {
  padding: 15px;
  width: 300px - @padding * 2;
}

But no, in Sass you can't, as far as I'm concerned.



回答2:

If its an option to use an other preprocessor then scss, I really recommend using Stylus. There is a feature called Property lookup which is exactly what you want.



标签: sass