如何在tabindex上打开一个div，并使其在tabindex中切换时保持打开状态'；使用CSS编辑内容

我有一个div，里面有一些链接，我希望用户能够通过tab浏览

<a href="#" class="skip-to">show</a>
<div id="skip-to-section-container">
    <a href="[[~[[*id]]]]#skip-to-content">Skip to main content</a>
    <a href="[[~[[*id]]]]#skip-to-navigation">Skip to Navigation</a>
    <a href="[[~[[*id]]]]#skip-to-footer">Skip to Footer</a>
</div>

所以我有两个问题，它可以打开，但是： -如果用户第二次按tab键，.skip to链接[显然]会失去焦点，并允许div再次隐藏。 -如果用户试图单击div中的其中一个链接，.skip to再次失去焦点，div关闭，链接无法单击

如何解决收尾div问题

#skip-to-section-container {
    padding: 18px;
    position:absolute;
    top:-161px;
    left:0px;
    color: #fff;
    border-right: 1px solid #3AB652;
    border-bottom: 1px solid#3AB652;
    /* border-bottom-right-radius:8px; */
    background: #3AB652;
    z-index:999999;
    }

#skip-to-section-container a {
    color:#fff;
    display: block;
    font-size: 1.2em;
    margin: 10px;
    font-weight: 600;
    }

a.skip-to {position: absolute; top: -50px;}

a.skip-to:focus + #skip-to-section-container {
    top: 0px;
}