在背景图像背景图像

我想在背景图像背景图像，但它隐藏了第一个图像。我的代码如下在背景图像背景图像

<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

在背景图像背景图像

回答

相关问题