折叠按钮上的图像

我可以用图像代替按钮来折叠并显示文本吗？折叠按钮上的图像

<button class="btn btn-info" style="background-color: #60bf3b; color: white;" type="button" data-toggle="collapse" data-target="#fatture">Per D.D.T. e Fatture:</button> 
 
<div id="fatture" class="collapse">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. 
 
</div>

感谢您的帮助！

来源

2017-04-03 mario

我不明白你想要什么，请进一步解释。 –

如果你想在点击崩溃效果尝试这一个https://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_eff_toggle –

如果您希望按钮有一个背景，你可以试试这个（fiddle）只需设置

.btn { 
    background: url("https://i.ytimg.com/vi/FhZrU6g9seg/maxresdefault.jpg") no-repeat transparent; 
    background-size: cover; 
}

并确保您有这3个包括在内：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

除非你只需要一个图像作为一个按钮，然后你可以做到这一点image fiddle

来源

2017-04-03 10:50:14

是的，这就是我需要的，非常感谢你！ – mario

没问题，很高兴我能帮你解决问题 –

<div class="container"> 
<img data-toggle="collapse" data-target="#demo" src="button.png" width="50px"> 
     <div id="demo" class="collapse"> 
     Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
     sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
     quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 
     </div>

来源

2017-04-03 11:08:31

折叠按钮上的图像

回答

相关问题