使用纯css单击外部任何位置时隐藏元素

Question

搜索我只能找到javascript / jquery解决方案，是不是有任何方法可以用css完成它？

#UserMenu.block { 
display: block; 
}

#UserMenu {
font-size: 16px;
padding: 15px;
display: none;
background: #333;
position: absolute;
left: 10px;
width: 200px;
}


#UserMenu a {
color: #24A9D8;
display: block;
position: relative;
padding: 5px 10px;
}

你可以在这里测试一下：

http://jsfiddle.net/hLch3jku/

Answer 1

您可以使用复选框来获取技巧。在其中放置标签和复选框。把你的其他元素。选中复选框后，使用css隐藏元素。但这是一个便宜的技巧，更好地使用javascript。