Yang penting ialah output, daripada memanggil imej melalui API, kita boleh menggunakan CSS untuk mengendalikan hasilnya.

Tajuk filem menolak imej ke bawah kerana ia berada dalam bekas yang sama jadi kami perlu memberikannya ketinggian.

Imej adalah dalam perkadaran yang berbeza, jadi anda boleh menggunakan object-fit: cover untuk memangkas imej pada saiz maksimum dengan ketinggian imej minimum.

Pada peranti mudah alih: Anda perlu menambah overflow设置为visible，并从.container-中取出padding child juga (jika tidak akan terdapat berbilang ruang tambahan), dan hanya kepada ibu bapa.

Perkara seperti ini akan dilakukan:

.container-child p {
       height: 50px;
       text-align: center;
       display: block;
   }
    /*from here the responsive code*/
    @media (max-width:1624px){
        .container-child img {
          object-fit: cover;
          max-width: 500px;
          max-height: 709px; /*the smallest image*/
          width: 100%;
          height: 100%;
        }
    }
    @media (max-width: 768px) {
    .container-child {
        padding-top: 0em; 
        display: inline-block;
        text-align: center;
       }
       #test {
        margin-top: 130px;
        display: inline-block;
        text-align: center
       }
       html, body {
        overflow: visible;
        background: #000;
       }
    }