html - 在a:hover上显示隐藏的div

我已经使用菜单/子菜单完成了此操作，但是由于稍微不同的原因，似乎无法使其正常工作。

我有以下是一个信息图形，以及一个带有一些文本的隐藏div：

<div class="basictext">
<p>This package allows you to "buy" a customisable web template from us to host on your own web hosting and register your own domain name for.</p>
</div>
<li class="title basic">Basic<br/><a></a></li>

在我的css中，.basictext隐藏（但设置了样式），并且当.basic a悬停时，.basictext应该使用display：block显示

.basictext {display: none; height: 60px; width: 130px; border: 2px solid #1572b8; background: #fff; padding: 10px;}.basic a:hover .basictext {display: block;}

只是根本没有出现，有什么帮助吗？

最佳答案

.basic a:hover .basictext   {display: block;}

将影响标签内的“ basictext”类元素位于“ basic”类的元素内。

<div class="basictext">
    <a> <span class="basictext">Will appear when hovering</span> </a>
</div>

您的html并非以这种方式构建，这就是规则不起作用的原因。