css 图像未剪裁

pbpqsu0x  于 2023-10-21  发布在  其他
关注(0)|答案(1)|浏览(125)

基本上,我从一张图片中PS了一个框架,现在我正试图让一张图片适合这个框架,这样它看起来就像图片在框架内。

<>
  <div className="flex justify-center items-center text-center">
    <div className="z-20 relative overflow-hidden h-[640px] w-[460px] object-cover">
      <Image className="w-full h-full" alt="its a frame" src="/frame.png" height={400} width={400} />
    </div>

    <Image
      className="aspect-square object-cover absolute"
      alt="its a goddamn moon "
      src={"/Moon.png"}
      // layout="fill"
      height={600}
      width={600}
    />
  </div>
</>

有什么建议吗?

f2uvfpb9

f2uvfpb91#

你可以试着把其中一个做成一个带有“background-image”属性的div:url()”和“background-size:然后将第二张图片放入该div中,宽度和高度设置为100%。然后,您应该能够调整第二个的填充或边框,使其看起来像图像是框架。

相关问题