css - 带链接的图像悬停缩放

I have this image zoom effect。如何使<a href="">Open image page</a>链接显示在图像中间的悬停上？

最佳答案

JSFIDDLE

您只需将text-align:center添加到<a>类的container_image标记中

另外，在<a>标记中进行了一些样式更改，如下所示：

.container_image a {
    margin-top: 5px;
    display: block;
    -webkit-transition: all 0.5s  ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out;
    text-align:center;
    visibility:hidden;
    opacity:0;
}
.container_image:hover a {
    visibility:visible;
    opacity:1;
}

关于css - 带链接的图像悬停缩放，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/24881385/