0

フォトフレームには、3x4列で表示される画像が含まれています。
画像がフォトフレームにこぼれ、防げないようです。
フォトフレームに「オーバーフロー」を使用しましたが、同じ結果が得られます。

写真がフォトフレームから溢れるのを防ぐにはどうすればよいですか？

style.css

.screenFrame {
    width: 350px;
    height: 475px;
    background-color: #FDF6C2;
    margin: 0 auto;
    }
    .photoFrame {
    overflow-y: scroll;
    }
    .bookPhoto {
      width: 100px;
      height: 113px;
      margin: 0 5px;
    }

photos.html

<div class="screenFrame">
   <div id="photoFrame" class="photoFrame">
       <a class="bookInfo" href="#"><img class="bookPhoto" src="mySrc" alt="" /></a>
       etc
   </div>
</div>
4

3 に答える 3

2

あなたのマークアップは正しくないと思います。

overflow-yオンに設定.photoFrameしますが、コード内の画像タグは.photoframedivの外側にあります。

これに変更してみてください：

<div class="screenFrame">
   <div id="photoFrame" class="photoFrame">
        <a class="bookInfo" href="#"><img class="bookPhoto" src="mySrc" /></a>
   </div>
</div>

<img>タグもきちんと閉じました。</img>画像タグを閉じるために使用することはありません。

于 2013-03-13T19:28:58.377 に答える
1

.photoframe. _ 特定の幅と高さが必要です。両方とも100％だと思います。また、何も指定しなかったため#photoframe、いくつかのスタイルがある場合もあります。

于 2013-03-13T20:18:10.487 に答える