如何将我的“阅读更多”更改为具有悬停效果的图像？

Question

我正在编辑我在互联网上下载的预制布局，我想编辑一个图像的“阅读更多”链接。

我想要实现的最好的例子就像在网站上 www.hongkiat.com。当您将鼠标悬停在继续阅读时，背景会发生变化。

模板中的代码是：

<div class="entry">
<p><?php the_content('Read More...'); ?></p>
</div><!--entry-->

非常感谢你！

Answer 1

您可以添加HTML <img> tag作为参数：

<?php the_content('Read more...<img src="' . get_bloginfo('template_directory'). '/images/leaf.gif" alt="read more" title="Read more..." />'); ?>

Answer 2

假设你有

<div class="entry">
<p><?php the_content('<span class="readmore">Read More...</span>'); ?></p>
</div><!--entry-->

您可以在CSS中添加行为，如下所示：

span.readmore{background-color:red}