Html 如何在css中使项目不可聚焦

我有一个菜单，它隐藏在应用程序的移动视图中，可以在桌面视图中查看。因此，由于它没有被激活，菜单中的项目在tab-through时不应该被聚焦，但是当菜单被隐藏时，它们是可以被tab的

这就是我在

application.html.haml

......
    .page-layout
      .page-layout-sidebar
        =link_to '/', class: "page-Branding page-Branding--secondary" do
          = image_tag site_logo_src, alt: 'Logo'
        %nav.page-Layout-nav{'aria-label' => 'Primary Navigation', 'role' => 'navigation'}
          %ul.topia-Nav
            - feature :item1 do
              %li
                =link_to t('menu.item1'), root_path, { :class => 'page-Nav-action'}
            - feature :item2 do
              %li
                =link_to t('menu.item2'), item2_path, { :class => 'page-Nav-action'}
......

---

我确实检查了页面，在多个css文件中看到了页面导航操作。我尝试在html中使用

tabindex:-1

，它在移动视图中工作，但在桌面视图中，我无法通过菜单项进行制表。另外，

tabindex

是HTML属性，因此不能在CSS中使用。我猜我已经从CSS中进行了更改。非常感谢您的帮助。

tabIndex

是您在HTML中需要的值。设置为

-1

将确保选项卡按钮不会聚焦元素。CSS中没有支持的方法来执行此操作。您可以在Javascript中切换

tabIndex

值

window.onresize = function(){
    if(this.innerWidth > 500){
        tabIndexes(0)
    } else {
        tabIndexes(-1)
    }
}

function tabIndexes(index){
    var inputs = document.querySelectorAll('input');
    for(var i = 0; i < inputs.length; i++) inputs[i].tabIndex = index;
}

window.onresize=function（）{
如果（this.innerWidth>500）{
选项卡索引（0）
}否则{
选项卡索引（-1）
}
}
函数选项卡索引（索引）{
var inputs=document.querySelectorAll（'input'）；
对于（var i=0；i

菜单是如何隐藏的？这是。。。不是HTML。有些媒体查询隐藏了这一点。@MikeMcCaughan抱歉，我不熟悉HTML和CSSI，由于文件名的结尾，我猜语言是HAML。请务必使用适当的标签。