我試圖將圖示放置在影像的右下角。有一個包裝器，不同尺寸的影像應該適合。還有一個 img-wrapper，包括影像和圖示。
問題是它需要為 img-wrapper 指定 100% 的高度，它也是一個圖示的父塊，所以結果是在這個塊的底部而不是影像。img 標簽也不支持 ::after 偽元素。
有沒有辦法在不帶js的情況下正確定位圖示？
示例：codepen.io/girich1/pen/YzrQaVw
uj5u.com熱心網友回復：
當然，你只需要 1 個小包裝來保存圖示。
<div >在這兩img.icon行周圍添加一個：
<div class="imgicons">
<img class="icon" src="https://img.icons8.com/color/50/000000/verified-badge.png"/>
</div>
接下來，.icon { ... }從 CSS 中洗掉當前部分。并添加以下內容：
.imgicons {
margin: 0; padding: 0;
position: relative;
text-align: right;
top: -30px;
padding-right: 10px;
}
.icon {
width: 20px;
height: 20px;
margin: 0; padding: 0;
}
如果我理解正確，那應該可以得到你想要的。
（僅供參考：圖示是20px; 我想你會想說一個10px與右下角相比的填充，加在一起就是30px; 這就是-30px指的）
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/387174.html