使悬停背景具有其标题的链接并更改悬停标题答案

【问题标题】：Make an hovering background have the link it's title has and change the hovering title使悬停背景具有其标题的链接并更改悬停标题
【发布时间】：2015-11-12 05:50:19
【问题描述】：

所以我面临一个非常大的问题。我有一个图像，当悬停时，会出现一个带有标题的白色框。现在标题有一个页面链接，但没有框。我尝试了很多东西（例如：将“display：inline-block;”应用于css（...））但仍然没有应用链接。关键是每个框都具有相同的链接具有它包含的标题。此外，我似乎无法更改标题（“打开”），并且图像在垂直方向之间有很多空白。有人知道如何解决这个问题吗？

页面链接：

http://portugalweddingphotographer.com/portfolio/

【问题讨论】：

寻求代码帮助的问题必须包括所需的行为、特定问题或错误以及在问题本身中重现它所需的最短代码。见How to create a Minimal, Complete, and Verifiable example

标签： html css hyperlink background hover

【解决方案1】：

而不是a标签只包裹文本，包裹上面的div标签，如：

<div class="section_hover">
    <a class="title_below_hover" href="http://portugalweddingphotographer.com/gallery/938/">
        <div style="display:inline-block;" class="grid_hover_div_padding">
            <div class="for_title_below the-title-hover">OPEN</div>
        </div>
    </a>
</div>

【讨论】：