Bootstrap 4 仅CSS下拉列表（不带popper.min）

我正在尝试从这里使用下拉组件-

然而，我试图做CSS只

HTML是文档的副本：

<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown button
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton" x-placement="bottom-start">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
  </div>  
</div>

然而，这是行不通的。你会推荐复选框破解而不是这个吗

---

checkbox hack的问题是，它一直保持打开状态，直到您再次单击它

首先，

div.dropdown

需要

tabindex

属性来聚焦

第二，即使

div.dropdown

具有正确的属性并且按钮已被单击，它也是获得焦点的按钮，而不是

div.dropdown

试试下面的CSS：

.dropdown>按钮：焦点~。下拉菜单{
显示：块；
}

工作代码段：

.dropdown>按钮：焦点~。下拉菜单{
显示：块；
}

下拉按钮

谢谢你，zmag！我运行了你的代码片段，但它不起作用。不过我接受了这个答案，因为事情看起来是对的。

.dropdown:focus {
   display: block
}

.dropdown:focus .dropdown-menu {
   display: block;
}