0

在这段代码中，我正在准备一个投资组合，现在当我在我的投资组合中放置一个图像时，该图像没有填充边框 div 并且像你在图片中看到的那样 < IMAGE-first half > ， < IMAGE-second half >。有人可以帮我保留四个仅具有图像边框的图像，并且我需要将所有四个图像都像四个盒子一样放置吗？

<section class="latestwork" id="work">
  <div class="container">
    <div class="row">
      <div class="heading">
        <h2 class="boxx">My Latest Work</h2>
        <h6>These are my latest mobile photography captures</h6>
      </div>
    </div>
    <div class="row">
      <div class="myworkbuttons">
        <button type="button" class="myworklink" data-filter="all">All</button>
        <button type="button" class="myworklink" data-filter="creative">Creative</button>
        <button type="button" class="myworklink" data-filter="black&white">Black/white</button>
        <button type="button" class="myworklink" data-filter="portrait">Portraits</button>
      </div>
    </div>
    <div class="row">
      <div class="portfolio-items" data-category="urban-floods">
        <div class="portfolio-inner-item" style="">
          <div class="portfolio-img">
            <img src="C:\portfolio's\drive-download-20210208T164603Z-001\The Disaster of 2020.jpg" alt="Image not loading">
          </div>
        </div>
        <div class="portfolio-info">
          <h4>Iso: </h4>
        </div>
      </div>

      <div class="portfolio-items" data-category="buffalo">
        <div class="portfolio-inner-item">
          <div class="portfolio-img">
            <img src="C:\portfolio's\drive-download-20210208T164603Z-001\buffalos path.jpg" style="float: left;" alt="Image not loading">
          </div>

        </div>
      </div>
    </div>

4

2 回答 2

0

发生这种情况是因为图像的大小不够大。

尝试添加width: 100%图像组件。

于 2021-02-21T11:47:59.157 回答
0

您可以使用网格并使用 css 导入文件并尝试以下代码： .div{background-image: url("/assets/pics/picture.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; min-height:50vh; min-width:50vw }//(or what size do you need.);

于 2021-02-21T11:52:50.093 回答