JavaScript - CSS レイアウトの問題!神のところに来なさい

Question

コード効果
http://u6.gg/Xbj

アバターをフレームに入れてアダプティブにしたいと考えています。

コードの変更を手伝ってくれるマスターが来ました。

Answer 1

1. .bg は相対的な位置を追加します。

アバターの外側に p を配置し、絶対位置を使用し、必要なサイズを設定します
2. すべてのキーユニットにパーセンテージを使用します

アバター設定幅、高さ100%

Answer 2

画像の長さと幅は100%です

Answer 3

画像アダプティブ img {max-width: 100%;}
あの人を写真に入れます

Answer 4

クラスを追加: <img class="img-box" src="./0.jpg" class="avatar">

クラススタイル:

.img-box {
position:絶対;
左:150px;
上:25px;
幅:122px;
高さ:124px;
}
.bg {
位置:絶対;
}
カットが見つかるはずです画像 特定のサイズが必要な場合は手動デバッグで作成しました

Answer 5

リーリー

必要に応じてウィンドウのサイズを変更します