我有以下代码,用于将三张背景照片彼此相邻放置。我不知道为什么超大型飞机上什么也没显示。您能否提示我找出可能的原因?
<div class="jumbotron jumbotron-fluid" style=" margin-top: 90px; ">
<div class="container text-sm-center p-y-3">
<div class="col-lg-3 col-md-3 col-sm-3" style=" background: url('./assets/img/glass.jpg'); background-repeat: no-repeat; background-size:contain ">
</div>
<div class="col-lg-6 col-md-6 col-sm-6" style="background: url('./assets/img/mhacks.jpg'); background-repeat: no-repeat; background-size:contain ">
</div>
<div class="col-lg-3 col-md-3 col-sm-3" style="background: url('./assets/img/rift.jpg'); background-repeat: no-repeat; background-size:contain ">
</div>
</div>
</div>
最佳答案
由于div内没有任何内容,因此,如果只需要div中的图像,则可以执行以下操作:
<div class="jumbotron jumbotron-fluid" style=" margin-top: 90px; ">
<div class="container text-sm-center p-y-3">
<div class="col-lg-3 col-md-3 col-sm-3">
<img src="./assets/img/glass.jpg" class="img-responsive" style="width:100%; height:auto"/>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<img src="./assets/img/mhacks.jpg" class="img-responsive" style="width:100%; height:auto"/>
</div>
<div class="col-lg-3 col-md-3 col-sm-3">
<img src="./assets/img/rift.jpg" class="img-responsive" style="width:100%; height:auto"/>
</div>
</div>
</div>