我的功能是使用纯css隐藏和显示div但是当我点击打开时,按钮仍然不会消失.
<a href="#show" id="open" class="btn btn-default btn-sm">Open</a> <div id="show"> some text... <a href="#hide" id="close" class="btn btn-default btn-sm">Close</a> </div>
和CSS看起来像：
<style>
#show {display: none; }
#show:target { display: inline-block; }
#hide:target ~ #show { display: none; }
<style>
当我添加这个：
#show:target ~ #open { display: none; }
按钮#open仍然没有隐藏
任何人都可以帮助我.
谢谢之前:)
解决方法
您可以通过将您的Open链接放在#show div中来解决它
HTML
<div id="show">
<a href="#show" id="open" class="btn btn-default btn-sm">Open</a>
<div id="content">
some text...
<a href="#hide" id="close" class="btn btn-default btn-sm">Close</a>
</div>
</div>
CSS
#content {
display: none;
}
#show:target #content {
display: inline-block;
}
#show:target #open {
display: none;
}
