1

コンパススプライトヘルパーを使用してアイコンを配置しています。アイコンはy軸で機能しますが、x軸では0に配置されています。これで、xオフセットを固定値に設定できましたが、むしろ「右」に設定したいと思います。

これが私のコードです:

background: {
  url: sprite-url($icons-sprite);
  repeat: no-repeat;
  position: sprite-position($icons-sprite, nav-active);
}

これは私が達成しようとしていることです(擬似コード):

background: {
  url: sprite-url($icons-sprite);
  repeat: no-repeat;
  position: right sprite-position-y($icons-sprite, nav-active);
}

誰かがこれに対する解決策を持っていますか?

4

1 に答える 1

3

自動スプライト

スプライト マップを作成する前に、スプライト マップの右側にスプライトを配置するスプライト エンジンを指定する必要があります (詳細については、ドキュメントを参照してください)。

$icons-nav-active-position: 100%;
@import "icons/*.png";

sprite-position()次に、通常どおり関数を呼び出します。

position: sprite-position($icons-sprite, nav-active);

手動スプライト

を呼び出すときはsprite-map()、引数を渡す必要があります$<map>-<sprite>-position: 100%(ここで<map>、 はスプライトを含むフォルダー名を表します)。

$icons-sprite: sprite-map("icons/*.png", $icons-nav-active-position: 100%);
background: {
  url: sprite-url($icons-sprite);
  repeat: no-repeat;
  position: sprite-position($icons-sprite, nav-active);
}

注 1:引数$position: 100%を渡して、すべてのスプライトの位置を設定できます。
注 2: Compass 0.12.1より前sprite-map()では、渡す引数は で始まりません<map>-問題 828を参照してください。

于 2012-11-24T17:59:44.280 に答える