在：：before伪元素上使用CSS转换

.posts.img悬停：在{
内容：''；
显示：块；
不透明度：0；
-webkit过渡：不透明度1.2秒；
-moz过渡：不透明度1.2秒；
-ms转换：不透明度1.2s；
-o-转变：不透明度1.2s；
过渡：不透明度1.2s缓解；
}
.posts.img hover:hover:before{
内容：''；
显示：块；
背景：url（“img/Texture1.png”）；
宽度：320px；
/*图像宽度*/
高度：220px；
/*像高*/
位置：绝对位置；
顶部：13px；
右：2px；
不透明度：1；
}

---

在悬停时，您可能只需要与转换相关的css，而不是伪元素的实际样式。试试这个

.posts .img-hover:before {
    content: '';
    display: block;
    background: url("img/Texture1.png");
    width: 320px; /* image width */
    height: 220px; /* image height */
    position: absolute;
    top: 13px;
    right: 2px;
    opacity: 0;
    -webkit-transition: opacity 1.2s ease;
    -moz-transition: opacity 1.2s ease;
    -ms-transition: opacity 1.2s ease;
    -o-transition: opacity 1.2s ease;
    transition:  opacity 1.2s ease-out;
}
.posts .img-hover:hover:before{
    opacity: 1;
}

---

对于浏览这个论坛的其他人，我来到这个帖子时遇到了完全相同的问题，我试图将转换焦点从

opacity 0.35s ease-in-out

致：

问题解决了。

---

我的浏览器是Chromium版本80.0.3987.162，Debian Linux 10.4

我有完全相反的问题（即

不透明度：1

在

伪元素之后突然出现在
上，但会根据
转换
而消失），尽管应用了定时功能和延迟。知道为什么吗？
all 0.35s ease-in-out