Html 文本在悬停CSS上消失

当我将鼠标悬停在文字上方时，文字将消失。我尝试删除隐藏的，并把可见性：可见，我改变了不透明度为1，但我仍然得到相同的-文本仍然消失时，我悬停。我试图使文本保持不变，悬停时什么也不做。奇怪的是，我有一个框边围绕着它，当我悬停的时候，整个下半部都消失了，所以一半的框和文本也消失了。我还缺什么吗

HTML 
<div class="col-xl-3 col-lg-4 col-md-4 col-sm-6 col-6 ">
   <div class="ps">
       <div class="thumbnail">
           <a href=" "><img src="http://placekitten.com/100/100" alt=" "></a>
            <div class="badge">10%</div>
                  </div>
 <div class="container">
         <a class="v" href="/Animal/Cat">Cat store</a>
 <div class="content">
  <a class="title" href="cat_new">kITTY</a>


 
 </div>
 </div>
  </div>
 </div>

---

移除

可见性：隐藏然后再次运行该程序，这在我尝试它时起作用。
删除此规则

.ps-product:hover .ps-product__content {
  visibility: hidden;
  opacity: 1;
  height: 0;
}

可见性隐藏
将鼠标悬停在
ps-product
上时，使具有类
ps-product\u内容的元素消失。因此，如果您不希望类
ps-product\u content
中的元素出现这种行为，您应该像下面的示例一样删除它：
.ps-product\u标题{
保证金：0；
显示：块；
填充：0 0 5px；
字体大小：14px；
线高：1.2米；
颜色：#06c；
--最大行数：2条；
最大高度：计算值（1.2米*var（--最大线））；
溢出：隐藏；
右侧填充：1rem；
不透明度：1；}
a{
位置：相对位置；
颜色：继承；
文字装饰：无；
转换：所有0.4s轻松；}
.ps产品：悬停.ps产品内容{
/* 
使包含ps-product类内容的元素隐藏。
可见性：隐藏；
*/
不透明度：1；
身高：0；
}
.ps产品：悬停{
边框颜色：银色；
}
.ps产品：hover.ps-product--内部.ps-product\u内容{
显示：块；
能见度：可见；
不透明度：1；
}

10%
5000040000
默认情况下，它的可见性：可见；它不会在悬停时隐藏文本，但您已将此属性应用为隐藏，这将导致在ps product:hover类中隐藏某些内容列表

您可以删除代码（
可见性：隐藏；
），也可以将其更改为
可见性：可见
`
请删除“ps产品：hover.ps-product\u内容”中隐藏的可见性

.ps-product:hover .ps-product__content {
  visibility: hidden;
  opacity: 1;
  height: 0;
}

 .ps-product__title {
    margin: 0;
    display: block;
    padding: 0 0 5px;
    font-size: 14px;
    line-height: 1.2em;
    color: #06c;
    --max-lines: 2;
    max-height: calc(1.2em * var(--max-lines));
    overflow: hidden;
    padding-right: 1rem;
    opacity: 1;}
    
    
    a {
    position: relative;
    color: inherit;
    text-decoration: none;
    transition: all 0.4s ease; 
 }
    
.ps-product:hover .ps-product__content {
 /*     remove  visibility: hidden;   */
  opacity: 1;
  height: 0;
}

.ps-product:hover {
  border-color: silver;
}

.ps-product:hover.ps-product--inner .ps-product__content {
  display: block;
  visibility: visible;
  opacity: 1;
}