我构建了一个简单的页面,无需向下滚动查看所有内容。css onclick在页面底部显示div
我有一些内容要显示在底部,但我不希望它在第一次显示。
我想让用户单击一个短语即可看到此内容。
该短语将首先定位在页面的底部,然后在点击后会稍微上升一点,为现在显示的隐藏内容留出空间。
如果你明白我的意思,这个内容会从下往上显示,就像是一个“反向下拉菜单”。
这是我的HTML。 “点击显示”h3是单击时会显示隐藏内容(四个按钮)的短语。
<div class="row text-center">
<h3 id="click-show">Click here to see the buttons.</h3>
<hr class="spacer">
<div class="col-md-3 col-xs-12">
<section> <a href="#"><button>
<h1>Button 1</h1>
</button></a> </section>
</div>
<div class="col-md-3 col-xs-12">
<section> <a href="#"><button>
<h1>Button 2</h1>
</button></a> </section>
</div>
<div class="col-md-3 col-xs-12">
<section> <a href="#"><button>
<h1>Button 3</h1>
</button></a> </section>
</div>
<div class="col-md-3 col-xs-12">
<section> <a href="#"><button>
<h1>Button 4</h1>
</button></a> </section>
</div>
</div>
我是初学者,我真的不知道是否可以通过使用CSS或其他语言来完成。
任何帮助/提示,将不胜感激!多谢你们 !
提供的css代码 –