themes/apachecon/layouts/partials/sponsor.html

<section class="sponsorship">
  <dl>
    <dt>{{ i18n "sponsorship_platinum" }}</dt>
    <dd class="platinum">
      <div class="img-wrap">
        <img src="images/logo/logo-Aliyun.png" alt="AliCloud" />
      </div>
      <div class="img-wrap">
        <img src="images/logo/logo-AntOpenSource.png" alt="AntOpenSource" />
      </div>
      <div class="img-wrap">
        <img src="images/logo/logo-ByteDanceOpenSource.jpg" alt="ByteDanceOpenSource" />
      </div>
    </dd>
  </dl>
  <dl>
    <dt>{{ i18n "sponsorship_gold" }}</dt>
    <dd>
      <div class="img-wrap">
        <img src="images/logo/logo-SelectDB.png" alt="SelectDB" />
      </div>
      <div class="img-wrap">
        <img src="images/logo/logo-Openbayes.png" alt="Openbayes" />
      </div>
      <div class="img-wrap">
        <img src="images/logo/logo-Mi.jpg" alt="Mi" />
      </div>
    </dd>
  </dl>
  <dl>
    <dt>{{ i18n "sponsorship_silver" }}</dt>
    <dd>
      <div class="img-wrap">
        <img src="images/logo/BAIDU.png" alt="BaiDu" />
      </div>
    </dd>
  </dl>
  <dl>
    <dt>{{ i18n "sponsorship_community" }}</dt>
    <dd>
      <div class="img-wrap">
        <img src="images/logo/logo-sf.png" alt="SegmentFault" />
      </div>
    </dd>
  </dl>
</section>
<style>
  .sponsorship dl {
    max-width: 860px;
    margin: 0 auto;
  }

  .sponsorship dl dd {
    min-height: unset !important;
  }

  .sponsorship dl dd img {
    max-height: 38px !important;
    max-width: 138px !important;
    object-fit: contain;
    width: auto;
    height: auto;

  }

  .sponsorship dl dd {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
  }

  .sponsorship dl dd .img-wrap {
    width: 162px;
    height: 62px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 8px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    margin-bottom: 16px;
  }
</style>