2016-05-13 20 views
-1

目標は、image() notationを使用せずに、純粋なCSSで代替画像を設定することです。そうでなければ、目標は、このコードを次のようになります。CSS:画像なしの代替背景画像の設定

#some-id{ 
     background-image: image('default-image.png', 'fallback-image.png'); 
} 

確かに、この質問を上昇コンテキストで、書かれたCSSが処理され、follwingコード:

#some-id{ 
     background-image: /*@var default-image */; 
} 

が返されます:

#some-id{ 
     background-image: url('/URL/TO/default-image.png'); 
} 

これはそのままですが、このプリプロセッサに複数のパラメータを渡す方法はありません。

すでに検討されているアイデアは、同じIDの直後にnoneに設定された背景イメージを持つアイデアの直後に設定することです。実際、プリプロセッサは、一致する画像がない場合にnoneを返します。したがって、コード内:

#some-id{ 
     background-image: /*@var default-image */; 
} 

#some-id[background-image=none]{ 
     background-image: /*@var fallback-image */; 
} 

残念ながら、それは動作しないようです。

答えて

0
#some-id { 
     background-image: url('fallback-image.png'); 
     background-image: image('default-image.png'); 
}