CSS。 鏈接不適用於input：focus

Question

我的問題有擺弄 。

據我了解-鏈接不起作用，因為當我單擊鏈接時，鏈接消失了，因為：focus不再有效。 但是我無法提出解決方案。

我認為這是一個非常普遍的問題，但是我沒有找到任何有關此的信息。

謝謝你的幫助。

CSS ：

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

#results {
    display: none;
}

HTML ：

<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>

Answer 1

只需在#results中添加一個懸停方法：

#results:hover{display:block;}

http://jsfiddle.net/gc6L323f/3/

Answer 2

我建議在您的情況下還包括:hover偽類，並使#results對象在懸停時可見。

像這樣 ：

#results:hover {
    display: block;
}

您可以檢查工作演示 。