css - 带有文本的悬停效果到菜单项

Question

我想对网站主菜单上的菜单项应用(悬停)效果。例如，如果您单击菜单项“如何”，将出现一个子页面。作为一个额外的效果，我想在文本 HOE 下看到一个额外的(子)文本(仅在鼠标悬停之后)。示例:如果您将鼠标悬停在名为“HOW”的菜单项上，我希望在“HOW”一词下方显示额外的文本。我已经为此测试了两个扩展，不幸的是没有明显的结果。这是网站: https://www.groenekoers.nl/Joost/

问候，罗纳德

Answer 1

<a href="page" class="element">
  HOW
</div>

<style>
    .element:hover:after {
        display: inline;
        content: 'HOE';
    }
</style>