背景画像上の背景画像

Question

背景画像上に背景画像を表示しようとしていますが、最初の画像を隠しています。

<li class="collapsed"> 
<a>Getting Started</a> 
</li> 


.collapsed { 
background-image: url(../images/expand_new1.png)!important; 
background-repeat: no-repeat; 
background-position: 141px 5px; 
background-size: 35px; 
-moz-background-size: 30%; 
-webkit-background-size: 30%; 
z-index:50; 

li.collapsed a{ 

opacity: 0.8; 
background-image: url(../images/assets/faq/faq_list_bg.png); 
display:block; 
padding-left:27%; 
font-family: 'Roboto'; 
font-size: 20px; 
font-weight: 300; 
color: #fff; 
z-index:-1; 

を次のように私のコードは、私はこの問題を解決するために助けてくださいfaq_list_bg.png

のexpand_new1.png表示トップを表示したいです。

expand_new1.png画像は白でfaq_list_bg.png画像は青です。それは完全に最初の画像を隠す。

[1]

Answer 1

NEW INFOに基づく

background-image: url(../images/assets/faq/faq_list_bg.png); 

EDIT削除[[私は白色のプラスアイコンでプラスアイコンを交換するとき、イメージが消え] [1]！]：

を

li.collapsed a:after { 
background-image: url('../images/expand_new1.png'); 
background-size: 20px 20px; 
display: inline-block; 
width: 20px; 
height: 20px; 
content: ""; 
} 

http://puu.sh/pBTSS/ffc491e491.png

あなたに+を変更したい場合は - または全て一緒に何度拡大：

li.collapsed.expanded a:after { 
background-image: url('NEW IMAGE LINK HERE'); 
background-size: 20px 20px; 
display: inline-block; 
width: 20px; 
height: 20px; 
content: ""; 
} 

Answer 2

あなたがz-indexプロパティを使用しますがposition値を設定していなかったので、それは最初の画像が非表示になります。それだけでそのpositionプロパティを明示的absolute、fixed、またはrelativeに設定されている要素上で動作しますので、

z-indexが機能していません。

positionをabsoluteに設定してください。