0

私は Compass の初心者で、スプライト ジェネレーターに非常に興味があります。私はそれがうまくいくのを見ます。チュートリアルに従ったのですが、スプライトに問題があります。というフォルダ内にファイルを挿入しましたspr。ファイル screen.scss に次のコードを既に挿入しました。

@import "spr/*.png";

そして、ヘッダーに次を挿入しました：

h1{
        @include spr-sprite(Flickr);
        height: 91px;
    }

インスペクターでチェックインしたところ、URLは正しく、背景の位置も正しいです。問題は、インスペクター要素をチェックインすると、画像の URL を開くことができないことです。生成された画像はファインダーで機能しますが、ファイルが存在しないためです。名前と場所は完璧です。

同じ問題を抱えているかどうか、特に解決方法を誰かに教えてもらえますか?

編集：生成されたCSS

.spr-sprite, header h1 {
    background: url('/images/spr-sbd3b4dd92d.png') no-repeat;
}
header h1 {
    background-position: 0 -120px; height: 91px;
}
4

1 に答える 1

1

スカウトにはなじみがないが...

現在、Sassはルート相対パス（先頭のスラッシュ）を使用しています。それらを解決するために：

  • ある種のローカルサーバーを使用していて、http経由でページをロードしている必要があります（http://...ブラウザのURLバーで）

  • サイトは（サブフォルダーではなく）Webフォルダーのルートにある必要があります

例えば：

├── css
│   └── site.css
├── images
│   └── spr-sbd3b4dd92d.png
├── index.html
└── sub-folder
    └── index.html

サブフォルダーにサイトルートを設定する場合、またはfile://プロトコルを使用してブラウザーにページをロードできるようにする場合は、config.rbで相対パスを有効にする必要があります。

relative_assets = true

それがすでにコメントされていない場合（つまり、先頭がない場合#）、config.rbスカウトは構成ファイルに注意を払っていてはなりません。

スカウトのバグのようです。

于 2013-02-21T04:44:23.643 に答える