问题描述:

Im extremely newbie in SCSS (or anyother kinda of coding rs) was just playing sass, then I stopped in a problem.

I was trying to use a mixing for multiple shadows to a box-shadow, how we all know in the tradicional css, it should be like that:

box-shadow: 0 1px 1px #333, 0 0 10px #222

Then I've coded this mixin:

@mixin set_shadow($shadows){

-moz-box-shadow:$shadows;

-webkit-box-shadow:$shadows;

box-shadow:$shadows;

}

and the result was almost what I wanted:

-moz-box-shadow: "0px 1px 1px black, 0px 0px 3px black";

-webkit-box-shadow: "0px 1px 1px black, 0px 0px 3px black";

box-shadow: "0px 1px 1px black, 0px 0px 3px black";

Buuut... sadly..

The quotes don't allow code works

How can I parse a string param in .scss (SASS), or one way to remove the quotes from the resulting css?

网友答案:

It seems like the unquote() function is what you are looking for:

@mixin set_shadow($shadows){
  -moz-box-shadow: unquote($shadows);
  -webkit-box-shadow: unquote($shadows);
  box-shadow: unquote($shadows);
}

h1 {
  @include set_shadow("0 1px 1px #333, 0 0 10px #222");
}

Alternatively, you can use variable arguments. And then pass an unquoted list of shadows.

@mixin set_shadow($shadows...){
  -moz-box-shadow: $shadows;
  -webkit-box-shadow: $shadows;
  box-shadow: $shadows;
}

h1 {
  @include set_shadow(0 1px 1px #333, 0 0 10px #222);
}
相关阅读:
Top