Html CSS。链接不'；t使用输入：focus

我的问题有点不对劲

正如我所理解的——链接不起作用，因为当我点击链接时，链接消失了，因为：焦点不再处于活动状态。但我想不出解决办法

我认为这是一个很常见的问题，但我没有发现任何关于这方面的信息

谢谢你的帮助

CSS：

#search:focus + #results {
    display: block;
}

#results {
    display: none;
}

<input id="search" type="text"/>

<ul id="results">
    <li><a href="/1"> First </a></li>
    <li><a href="/2"> Second </a></li>
    <li><a href="/3"> Third </a></li>
</ul>

HTML：

#search:focus + #results {
    display: block;
}

#results {
    display: none;
}

<input id="search" type="text"/>

<ul id="results">
    <li><a href="/1"> First </a></li>
    <li><a href="/2"> Second </a></li>
    <li><a href="/3"> Third </a></li>
</ul>

只需将悬停方法添加到#结果：

#结果：悬停{display:block；}

---

我建议在您的案例中也包括

：hover

伪类，并使

#results

对象在hover上可见

像这样：

#results:hover {
    display: block;
}

---

您可以查看。

谢谢，这正是我想要的。