将图像转换为背景图像

Question

我有可以在div内获取图像的工作代码，但是当我检查它是否可移动时，图像太小，当我增加其高度时，它变得不成比例，因此我试图将其转换为背景图像。

我现在有什么：

 <div class="carousel-item '; if ($num == 0) {echo ' active ';} echo'" >
    <img class="d-block w-100 h-100" src="'.substr($leaderboard->$topbd_ContentImg,3).'" alt="First slide">
      <div class="carousel-caption d-none d-md-block" style="position:fixed; top: 10%;">
         <h5>'.$leaderboard->$topbd_ContentMenu.'</h5>
         <div class="space-15"></div>
         <p style="font-size:185%;">'.$stringaux.'</p>
         <span class="d-none d-lg-block">
            <div class="space-10"></div>
            <a href="'.$url.'"><img src="static/img/leaderboard-seta.png" /></a>
         </span>
      </div>
 </div>

我尝试将img class="d-block w-100 h-100"放到div class="carousel-item中作为没有成功的背景。

如何使图像成为仅插入图像的背景？

Answer 1

您是否希望图像成为整个轮播项目的背景？ 如果是这样，则可能可行：

self._read_pypirc()

除此之外，您还必须将以下CSS添加到~/.pypirc

<div class="carousel-item '; if ($num == 0) {echo ' active ';} echo'" style="background-image:url('.substr($leaderboard->$topbd_ContentImg,3).')">
    <div class="carousel-caption d-none d-md-block" style="position:fixed; top: 10%;">
        <h5>'.$leaderboard->$topbd_ContentMenu.'</h5>
        <div class="space-15"></div>
        <p style="font-size:185%;">'.$stringaux.'</p>
        <span class="d-none d-lg-block">
          <div class="space-10"></div>
        <a href="'.$url.'"><img src="static/img/leaderboard-seta.png" /></a>
        </span>
    </div>
</div>

背景位置是可选的，它允许您修改如何对齐这些图像，您可能需要阅读此CSS属性及其选项。