Html 仅使用css在下拉列表外部单击时隐藏下拉列表

我致力于实现一个类似于此的下拉菜单

我面临的问题是，如何仅使用css关闭下拉菜单外的单击下拉菜单

---

提前感谢。

该菜单使用状态为

已选中的单选按钮来显示下拉内容；它似乎是故意设计成让下拉菜单保持打开状态，除非单击另一个菜单项，所以克服这一点很困难。似乎更适合你想要的。我想你必须在菜单后面做一个覆盖层，也就是一个收音机。因此，当它被选中时，其他人应该取消选中以进行迭代，我试图实现的是一个使用复选框hack的下拉菜单，它在选中复选框时打开下拉菜单（不可见），并在重新单击它时关闭。我还试图在单击下拉分区之外时关闭下拉列表。您不能仅使用纯CSS来完成此操作，您必须使用javascript或jquery来控制单击事件。或者正如@derHugo所说，你必须在身体的某个地方放置另一个无线电复选框并将其隐藏。因此，每当用户单击身体时，他都会取消选中前面的复选框。