6

さまざまなサイズの画像を div の下部に配置できるようにしたいと考えています。

次のマークアップがあります。

<div class="container">
  <div class="container">
    <div class="footer-images">
      <a href="link1"><img src="img1"></a>
      <a href="link2"><img src="img2"></a>
      <a href="link3"><img src="img3"></a>
    </div>
  </div>
  <div class="container">
    <div class="copyright">
      <p>© Some Company YYYY</p>
    </div>
  </div>
</div>

すべての画像を footer-images div の下部に配置する方法がわかりません。どんな助けでも大歓迎です。

4

5 に答える 5

5

これを試して

 .footer-images img{
        vertical-align:bottom;
        border:0;
        }
于 2013-03-22T11:37:11.980 に答える
2

これは役に立ちますか?

<style type="text/css">
.footer-images {
    margin: auto;
    display: block;
    position: absolute;
    bottom: 0;
}
.footer-images .copyright {
    text-align: center;
}
</style>

この HTML の使用

<div class="container">
  <div class="container">
    <div class="footer-images">
      <a href="link1"><img src="http://placehold.it/350x150"></a>
      <a href="link2"><img src="http://placehold.it/640x480"></a>
      <a href="link3"><img src="http://placehold.it/120x120"></a>
      <div class="container">
        <div class="copyright">
          <p>© Some Company YYYY</p>
        </div>
      </div>
    </div>
  </div>
</div>
于 2013-03-22T11:24:47.377 に答える
1

このCSSに慣れて適用する

.footer-images img{
width:xxpx;
height:xxpx;           // add here your style as like with height border etc.
vertical-align:top;
border:0;
}

ブートストラップの詳細

于 2013-03-22T11:11:26.010 に答える