javascript - masalah susun atur css! Datanglah kepada Tuhan

Question

Kesan kod
http://u6.gg/Xbj

Saya mahu meletakkan avatar ke dalam bingkai dan menjadikannya adaptif.

Seseorang boleh membantu saya menukar kod.

Answer 1

1. .bg menambah kedudukan relatif;

2. Letakkan p di luar avatar dan gunakan kedudukan mutlak, tetapkan saiz yang anda mahu Gunakan peratusan untuk semua unit utama

3. Lebar tetapan avatar, tinggi100%

Answer 2

img panjang dan lebar adalah 100%

Answer 3

Img suai imej {maks-lebar: 100%;}
Letakkan orang itu dalam gambar

Answer 4

Tambah kelas: <img class="img-box" src="./0.jpg" class="avatar">

gaya kelas:

.img-box {
kedudukan: mutlak;
kiri: 150px;
atas: 25px;
lebar: 122px;
tinggi: 124px;
}
.bg {
kedudukan: mutlak;
}
}

imej Orang mahukan saiz tertentu, saya membuatnya dengan penyahpepijatan manual🎜

Answer 5

.bg {
    position: relative;
}

.avatar {
    position: absolute;
    top: 9%;
    left: 14.5%;
    width: 12%;
}

.top-bg {
    width: 100%;
    position: relative;
    z-index: 2;
}

Tukar saiz tingkap mengikut kehendak anda