css怎么把文字放图片左下角

css怎么把文字放图片左下角？如图这样

"shop-bug">
                    "shop-img" src="../../static/tab/img.jpg">
                    <p class="dynamicText">{{item.dynamicText}}

                

.shop-bug {
        position: relative;
    }
    
    .dynamicText {
        position: absolute;
        top: 0;
    }
    
    .shop-img {
        width: 90%;
        height: 200px;
        border-radius: 20px;
        background-color: #2cb6fe;
        margin-left: 5%;
        margin-top: 20px
    }

.dynamicText {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2; //有需要的话可以设置
}

定位，然后z-index调整层级

将top设置为负数，在img上面，具体位置根据自己设计调整
或者将top改成bottom

.dynamicText {
  position: absolute;
  top: -30px;
  left: 7%;
  z-index: 10        
}

// 或

.dynamicText {
  position: absolute;
  bottom: 10px;
  left: 7%;
  z-index: 10        
}