在背景圖像背景圖像

我想在背景圖像背景圖像，但它隱藏了第一個圖像。我的代碼如下在背景圖像背景圖像

<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;

我想顯示expand_new1.png的顯示頂部faq_list_bg.png

請幫助解決這個問題。

expand_new1.png圖像爲白色，faq_list_bg.png圖像爲藍色。它完全隱藏了第一張圖片。

[[當我替換白色加圖標的加圖標然後圖像消失] [1]！] [1]

來源

2016-06-21 VipinS

爲什麼背景圖像呢？ –

這是一個列表和expand_new1.png圖像動態改變與JavaScript – VipinS

當我添加其他彩色圖像，然後它顯示褪色，但白色它完全看不見。 – VipinS

刪除

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

EDIT基於新的信息：

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: ""; 
}

來源

2016-06-21 22:07:29

這個圖片需要顯示，所以不能刪除 – VipinS

你說：我想展示的是expand_new1.png display faq_list_bg.png的頂部，你需要澄清一下是什麼意思。這種方式描述了您只想看到expand_new1.png的聲音。並將faq_list_bg.png隱藏在後面。 Jfiddle設置很長。 –

我想要顯示白色加圖標和入門。請參閱鏈接http://melpapp.com/beta/userguide.html – VipinS

它隱藏的第一形象，因爲你使用的z-index財產，但沒有設置position值。

z-index不工作，因爲它只會一個元素，其position屬性已明確設置爲absolute，fixed，或者relative上工作。

在你的情況下，將position設置爲absolute。

來源

2016-06-21 22:16:14 jay

它不工作 – VipinS

你想做什麼？在第一張圖片下方顯示第一張圖片或第二張圖片？ – jay

還有一件事你沒有添加顯示：在第一個圖像塊！ – jay

在背景圖像背景圖像

回答

相關問題