如何仅通过CSS使同一类的div链接到WordPress中的不同URL()

我正在尝试在WordPress主题中单击整个推荐瓷砖。主题是Orfeo, 网站是storytwirl.com
见证磁贴具有两个div-未与任何内容链接的外部div类卡卡片-见证卡平原和与URL链接的内部div类卡头像。
主题支持_card-avatar中的链接。但我希望将整个div类卡卡片-证明书卡片链接到与其内部div类卡化身相同的URL。一共有三个个人鉴定磁贴, 我希望它们链接到三个不同的URL。
我没有找到通过Wordpress访问HTML的方法, 而只是将链接移动到卡证言证卡平原div。我也没有在php文件中看到有关此类的任何信息。
这三个磁贴之间的唯一区别是div类card-avatar中的href和title。
我在Wordpress Customizer中使用了” 其他CSS” 来添加CSS, 从而使具有类卡, 证人证和普通证件的div看起来像是可单击的, 但实际上无法将链接添加到这些div中。而且我不知道如何仅使用CSS将三个不同的链接添加到每个证明卡。你能帮我吗?
是否可以采用此CSS代码, 并为三个卡卡-证人卡-普通div中的每个添加链接, 而每个图块都使用不同的URL?

/* CSS that makes tiles look clickable but does not add actual links */ div.card.card-testimonial { cursor: hand; cursor: pointer; opacity: .9; }a.divLink { position: absolute; width: 100%; height: 100%; top: 0; left: 0; text-decoration: none; /* Makes sure the link doesn't get underlined */ z-index: 10; /* raises anchor tag above everything else in div */ background-color: white; /*workaround to make clickable in IE */ opacity: 0; /*workaround to make clickable in IE */ filter: alpha(opacity=0); /*workaround to make clickable in IE */ }

这是HTML:
< div class="card card-testimonial card-plain"> < div class="card-avatar"> < a href="http://storytwirl.com/topic/animation-ideas/"> < img class="img" src="http://img.readke.com/220530/19134Kc3-0.png" alt="Animation Ideas" title="Animation Ideas"> < /a> < /div> < div class="content"> < h4 class="card-title"> Animation Ideas< /h4> < h6 class="category text-muted"> Stories for Films, Series, Games & amp; More< /h6> < p class="card-description"> I have plenty of ideas for animated films, TV series, web series, games, and live action. Variety of styles, variety of audiences, and variety of genres. I would love to develop these ideas with you or jump onto your idea to help to develop it into full production.< /p> < /div> < /div>

谢谢Andrei Gheorghiu回答了这个问题! =)
#1这样做:
div.card.card-testimonial { position: relative; } div.card.card-testimonial a:before { width: 100%; height: 100%; position: absolute; left: 0; top: 0; content: ''; }

它在你的< a> 上创建一个before伪元素, 并用position:relative(这是卡片)填充最近的父元素。如果卡中没有任何东西具有固定的z索引, 则它也将显示在卡中的所有其他东西之上。
实际上, 它是你卡的万能点击, 将其分配给其父< a> 。
【如何仅通过CSS使同一类的div链接到WordPress中的不同URL()】注意:如果卡的任何子元素和< a> 的祖先元素具有position:relative, 则此技术会中断, 并且还会为卡中的每个链接创建伪元素。在这种情况下, 卡将指向其DOM中的最后一个链接, 因为它将放置在最后。

    推荐阅读