求助：为作品集盒子添加CSS实现文本固定显示于底部

• 先通过浏览器开发者工具定位到你页面中作品集盒子及文本对应的CSS类名（以下示例用常见类名演示，需替换为实际类名）
• 添加以下CSS代码：

/* 设置父容器为相对定位，让文本的绝对定位基于该容器 */
.portfolio-box {
  position: relative;
  overflow: hidden;
}

/* 配置文本容器固定显示在图片底部 */
.portfolio-box .text-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.6); /* 半透明黑底，匹配理想效果 */
  color: #fff;
  padding: 10px 15px;
  opacity: 1; /* 强制默认显示，覆盖原hover时的隐藏规则 */
  transform: none; /* 移除原hover触发的位移动画 */
}

/* 覆盖原hover状态样式，确保文本始终显示 */
.portfolio-box:hover .text-overlay {
  opacity: 1;
  transform: none;
}

• 调整说明：
  • 替换示例中的.portfolio-box和.text-overlay为你页面实际的类名
  • 可根据理想效果修改background-color的透明度、padding值、字体大小等样式

内容的提问来源于stack exchange，提问作者Muhammad Tahir