如何仅使用 HTML 使下拉菜单项中的父元素具有可见焦点

Question

我试图使下拉菜单中的父元素在被选中时具有可见的焦点，以解决可访问性问题。但是，出于某种原因，我无法访问 css 文件，因此我需要使用 HTML 来实现这一点。有没有办法做到这一点？代码现在看起来像这样：

<li class = dropdown
class = "dropdown" data-toggle="dropdown" aria-haspopup="true">

很抱歉，如果这个问题有点含糊，我不知道该怎么做

Answer 1

您的元素目前似乎无法获得焦点。默认情况下，列表元素不可聚焦，因此您应该首先通过向其添加 tabindex="0"

使其可聚焦

<li aria-haspopup="true"
    class = dropdown
    data-toggle="dropdown" 
    tabindex="0"><!-- li content --></li>

现在您应该会看到浏览器的默认聚焦环。没有在内联样式上使用伪类（例如 :focus）的选项，因此如果您无权访问 CSS 文件，并在顶部添加

How to make the parent element in a dropdown menu item have visible focus using only HTML