在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML5/ 關(guān)于scss變量拼接問題

關(guān)于scss變量拼接問題

1.開發(fā)中遇到了關(guān)于變量拼接的問題：在scss中使用for循環(huán)展示gulp生成的雪碧圖。
2.像這樣：

@for $i from 0 through 88 {
  .emotion-#{ $i } {
    @include sprite();
    display: inline-block;
  }
}

3.我的問題是在sprite中的參數(shù)寫的是$emotion-1，$emotion-2，$emotion-3......的格式，所以需要進行拼接，試過$emotion-#{$i}還有其他各種方法，只能查到參數(shù)是一個純變量的例子，但是沒有拼接的例子，希望大神指教

回答
編輯回答
拮據(jù)

#{$animal}表示變量，后面直接連接想要的字符串

//sass style
//-------------------------------
$animal-list: puma, sea-slug, egret, salamander;
@each $animal in $animal-list {
  .#{$animal}-icon {
    background-image: url('/images/#{$animal}.png');
  }
}

//css style
//-------------------------------
.puma-icon {
  background-image: url('/images/puma.png'); 
}
.sea-slug-icon {
  background-image: url('/images/sea-slug.png'); 
}
.egret-icon {
  background-image: url('/images/egret.png'); 
}
.salamander-icon {
  background-image: url('/images/salamander.png'); 
}

https://www.w3cplus.com/sassg...

2017年9月12日 09:06
編輯回答
汐顏

沒明白。。。

2017年6月6日 03:21