我在 css 中玩網格顯示時遇到了一個非常奇怪的問題,如果我有至少 1 個未設定為絕對定位的影像,下面的代碼可以作業(顯示所有影像),否則,它們都會消失。對此有任何想法或解決方法嗎?
<div className="grid grid-cols-2">
<div className="shapeA overflow-hidden aspect-square relative">
<img src="/mizuki.png" className="absolute z-20 opacity-[0.7]" />
<div className="w-full h-full absolute bg-ni25-30 z-10 blur-sm opacity-[0.5] backdrop-blur-sm"></div>
</div>
<div className="shapeB overflow-hidden aspect-square relative">
<img src="/ena.png" className="absolute z-20 opacity-[0.7]" />
<div className="w-full h-full absolute bg-ni25-30 z-10 blur-sm opacity-[0.5] backdrop-blur-sm"></div>
</div>
<div className="shapeC overflow-hidden aspect-square relative">
<img src="/mafuyu.png" className="absolute z-20 opacity-[0.7]" />
<div className="w-full h-full absolute bg-ni25-30 z-10 blur-sm opacity-[0.5] backdrop-blur-sm"></div>
</div>
<div className="shapeD overflow-hidden aspect-square relative">
<img src="/kanade.png" className="absolute z-20 opacity-[0.7]" />
<div className="w-full h-full absolute bg-ni25-30 z-10 blur-sm opacity-[0.5] backdrop-blur-sm"></div>
</div>
</div>
uj5u.com熱心網友回復:
您必須為元素設定寬度,否則它將無法正確顯示所有專案。一個作業的 jsfiddle 會作業得更好,或者鏈接到有問題的頁面
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/465717.html
