Question

我正在尝试使用响应中的一些图像制作DIV。

 #copyright-wrap {
   background: none repeat scroll 0 0 #fff;
   box-shadow: 0 0 3px #888;
   color: #444;
   margin-top: 60px;
   overflow: hidden;
   padding-left: 2px;
   padding: 25px 20px 15px;
   text-align: center;
 }
 #copyright-text {
   display: inline-block;
   margin-bottom: 15px;
 }
 #copyright-wrap a {
   color: #444;
   text-decoration: none;
 }
 #copyright-text img {
   height: 85px;
   margin-right: 5px;
 }

<div id="copyright-wrap">
  <div id="copyright-text">
    <a href="#">
      <img src="logo1-copy.png" alt="logo1 copy" class="alignnone size-full wp-image-778" />
    </a>
    <a href="/town-view-cairo/">
      <img src="logo2-copy.png" alt="logo2 copy" class="alignnone size-full wp-image-779" />
    </a>
  </div>
</div>

我尝试过提供容器min-width和max-width，但无济于事。我做错了什么？

Answer 1

试试这个。我不确切知道你需要什么，但无论如何这里都适合你。

#copyright-wrap {
  background: #fff;
  box-shadow: 0 0 3px #888;
  color: #444;
  margin-top: 20px;
  overflow: hidden;
  padding: 20px;
  text-align: center;
}
#copyright-wrap a {
  display: inline-block;
  color: #444;
  text-decoration: none;
  margin: 0 5px;
}
#copyright-text img {
  max-width: 100%;
  max-height: 85px;
}

<div id="copyright-wrap">
  <div id="copyright-text">
    <a href="#">
      <img src="http://placehold.it/250x250/cdcdcd" alt="logo1 copy" class="alignnone size-full wp-image-778" />
    </a>
    <a href="/town-view-cairo/">
      <img src="http://placehold.it/250x250/cdcdcd" alt="logo2 copy" class="alignnone size-full wp-image-779" />
    </a>
    <a href="/sunset-pearl-sahl-hasheesh/">
      <img src="http://placehold.it/250x250/cdcdcd" alt="logo3 copy" class="alignnone size-full wp-image-780" />
    </a>
    <a href="/vacation-club/">
      <img src="http://placehold.it/250x250/cdcdcd" alt="logo4 copy" class="alignnone size-full wp-image-781" />
    </a>
    <a href="/paradise-gardens-sahl-hasheesh/">
      <img src="http://placehold.it/250x250/cdcdcd" alt="logo5 copy" class="alignnone size-full wp-image-782" />
    </a>
  </div>
</div>

如何使Div与图像响应

1 个答案: