Css 边框悬停图片效果

Question

我正在尝试在 wordpress 主题中的图像上方应用悬停效果。效果应显示边框和带有文本的背景。问题是边框比图像更宽更高，我不明白为什么。我尝试了很多解决方案，但结果总是一样的：边框只出现在我的顶部和左侧。我要疯了....

这是我页面上的link：

有什么建议吗？

提前致谢，弗朗切斯科

Answer 1

添加此代码

.topImage2 .bordo {
    border: 0 solid #fff;
    box-sizing: border-box;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 78;
}

您只需将 box-sizing: border-box; 添加到 .topImage2 .bordo

Css 边框悬停图片效果

Css Border hover image effect

html

css

border

hover

css-transitions