html - 图片大小不适合div

Question

我必须适应我的 div 尺寸是 height=250px 和 width=1000px 并且想要自动适应这个尺寸的图像。但是当我上传图片时，它不适合 div。

我的代码在这里:

CSS

#main {
  width:1000px;
  margin:0 auto;
  background: #fff;
  position:relative;
  z-index:1;
}
.promo-image {
  margin:0 0 8px;
}
.promo-image img {
  vertical-align:top;
}

html:

<main id="main" role="main">
  <div class="promo-img">
    <?php
      $sql4 = "SELECT * FROM adverts_top ORDER BY id DESC LIMIT 1";
      $query4 = $conn->query($sql4);
      $row4 = $query4->fetch(PDO::FETCH_ASSOC);
      $link4 = $row4['link_url'];

      $images4 = $row4['imagepath'];
      $immg4 = basename($images4);
      $imagee4 = "adverts"."/".$immg4;

      $rowc = $query4->rowCount(PDO::FETCH_ASSOC);

      if ($rowc>=1) {
        echo "
            <a href='$link4'; target='_blank'><img src='$imagee4';></a>
             ";
      }
      else {
            echo "";
      }
   ?>
  </div>
</main>

Answer 1

您需要使用 width:100%在<img>您可以使用内联 css，也可以将其写入外部文件

内联

<a href='$link4'; target='_blank'><img src='$imagee4'; style="width:100%"></a>

外部

在 <img> 中通过类(class)并照着写css

<a href='$link4'; target='_blank'><img src='$imagee4'; class="fullWidth"></a>

.fullWidth{
  width:100%;
}