为什么我在CSS:focusselector上遇到问题？

我已经创建了一个CSS垂直子菜单，它可以与：悬停选择器配合使用以打开子菜单的。但是，当我尝试将其更改为：焦点选择器时，它不起作用。谁能告诉我我做错了什么？代码纯粹是CSS，没有涉及Javascript

nav-ul{
页边顶部：1px；/*将子ul塞入父li附近*/
边框颜色：蓝色；
边框宽度：10px；
边框样式：实心；
宽度：150px；
溢出：隐藏；
}
李海军{
列表样式类型：无；
边框颜色：浅绿色；
边框宽度：10px；
边框样式：实心；
}
李国荣{
显示：无；
边框颜色：石灰；
边框宽度：10px；
边框样式：实心；
保证金：1px；
利润上限：-10px；
左边距：-10px；
}
导航{
背景色：#c8b99c；/*浅棕色*/
宽度：220px；
左边距：自动；
右边距：自动；
}
已选定的导航ul li{
背景色：#c18946；
}
nav li a{/*使整个框可点击，而不仅仅是链接文本*/
display:block；/*HTML元素li不接收焦点。这就是为什么：焦点选择器不处理li元素

可以通过向li元素添加tabindex属性来解决此问题

例如：


nav-ul{
页边顶部：1px；/*将子ul塞入父li附近*/
边框颜色：蓝色；
边框宽度：10px；
边框样式：实心；
宽度：150px；
溢出：隐藏；
}
李海军{
列表样式类型：无；
边框颜色：浅绿色；
边框宽度：10px；
边框样式：实心；
}
李国荣{
显示：无；
边框颜色：石灰；
边框宽度：10px；
边框样式：实心；
保证金：1px；
利润上限：-10px；
左边距：-10px；
}
导航{
背景色：#c8b99c；/*浅棕色*/
宽度：220px；
左边距：自动；
右边距：自动；
}
已选定的导航ul li{
背景色：#c18946；
}
nav li a{/*使整个框可点击，而不仅仅是链接文本*/
display:block；/*我修复了它。我需要：focus in，而不是：focus。
链接和表单元素可以获取焦点，任何其他元素都需要tabindex属性。将其设置为tabindex=“0”为了避免使用tab键导航示例Narayanan时出现奇怪的交互，该代码在我运行它时不起作用。我已使用代码段更新了我的答案。它现在应该可以工作了。它对我仍然不起作用。我希望在菜单处于焦点时打开它。您的代码将只在悬停时打开它。tabindex正在将它引入要对焦，我知道这一点，因为我已经测试过了。但是，对焦时子菜单无法打开。它在悬停时工作。我不明白。我完全被迷惑了。