1

コンパスサスで「右-300px」などのスプライト位置を生成する方法は?
sass は背景位置を数値でしか出力できないことがわかりましたが、スプライト位置を右揃えまたは下揃えにする必要がある場合があります。
plsは以下の私のコードを参照してください:

<style type="text/css">
    /* ------- scss ------- */
    $map_btn: sprite-map("sprite_btn/*.png");
    .btn,.btn span{
        display:inline-block;
        background-image: sprite-url($map_btn);
        background-repeat: no-repeat;
    }
    .go_to_cart{
        background-position: sprite-position($map_btn,go_to_cart);
        span{
            background-position: sprite-position($map_btn,go_to_cart);
        }
    }

    /* ------- output ------- */
    .btn,.btn span{
        display:inline-block;
        background-image: url('../images/btn_sprite.png');
        background-repeat: no-repeat;
    }
    .go_to_cart{
        background-position: 0 -300px;
    }
    .go_to_cart span{
        background-position: 0 -330px;
        /* ------- 
            but I want to output like this bellow:
            how to write in scss?
        ------- */
        background-position: right -330px;
    }

</style>
<a href="#" class="btn go_to_cart">
    <span></span>
</a>

ここに画像の説明を入力

4

1 に答える 1

0

これは古い質問ですが、誰かが答えを必要とする場合に備えて。

スプライトマップを使用する場合、基本的にスコープをオフセットし、スプライトマップの目的を無効にするため、そのように背景を揃えることはできません(または揃えるべきではありません)。

スプライトを整列させたい場合は、スプライトのコンテナを配置/整列する必要があります。

于 2013-03-12T16:24:27.057 に答える