css - 在悬停 css 上滑动图像的 50%

Question

我在一个网站上工作，并使用响应式 CSS 成功地将它从 html4.0 转换为 html5。

但最后，我遇到了一个问题。原始站点在页脚中有一个图像，它在 y 轴上显示 50%，当您将鼠标悬停在它上面时，它会显示隐藏。实例 -> bsonspec.org

图像位于文件夹 assets/cc.png 中，源代码位于 https://github.com/Rohitkumary/bsonspec 下方

提前致谢。

Answer 1

将过渡属性添加到“a.ro”

a.ro { 
    background-repeat: no-repeat;
    background-position: 0 0;
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 150px;
    height: 70px;
    transition: all 0.2s ease-in-out; // add this line
}