Bigcommerce StencilはCSSでハンドルバーヘルパーを使用して背景画像を設定します

背景画像を設定するためにCSSファイルからcdn画像の場所を参照する方法はありますか？たとえば、私が使用してイメージファイルを参照することができコンポーネントファイルに：私はCSSの背景画像としてその画像を使用したい場合はBigcommerce StencilはCSSでハンドルバーヘルパーを使用して背景画像を設定します

{{cdn 'img/my-image.jpg'}}

、私はスタイルシートで設定する必要があります。例：

.element { 
    background-image: url({{cdn 'img/my-image.jpg'}}); 
}

これは可能ですか、またはhtmlに背景画像をインラインで設定する必要がありますか？

私はカスタムのstencilStringメソッドがあることを知っていますが、CDNのイメージのURL全体をハードコードしたくないので、これが私の状況でどのように機能するのか分かりません。

出典

2016-03-18 flyingL123

現在、ステンシルでは、変数で参照する方法がありません。これは青写真で利用可能です。

出典

2016-03-21 17:35:20 Alyss

ありがとうございます。誰か助けてください：http://stackoverflow.com/q/36000933/736864 – flyingL123

あなたは常にインラインスタイルを使用して設定できます

<div class="element" style="url({{getImage image 'gallery' (cdn 'img/my-image.jpg') }}">

「ギャラリーが取得する画像のサイズを指します。 {{getImage}}ヘルパー・ドックを参照してください。here

出典

2016-06-02 16:16:39

はい、私はその質問に言及しました。 – flyingL123

Bigcommerce StencilはCSSでハンドルバーヘルパーを使用して背景画像を設定します

答えて

関連する問題