HTML

04
May
Html 未知高度折叠菜单使用transition过渡动画
这是此前项目要实现的效果,一个简单的折叠框,但为了让其使用更加的顺滑,想通过加入transition过渡动画让其展开更加的舒服。但是有一个致命的问题,transition过渡动画是必须得提前知道元素的起止属性,即展开前高度和展开后高度,因为里面内容是动态的,所以无法直接给出最终高度。使用max-height属性能实现过渡动画,但是效果太差,所以采用了js计算高度的方式。首先给父容器即折叠栏赋予overflow: hidden;和固定的高度的classflod,以及过渡动画transition: height .75s;,子元素即内容赋予visibility: hidden;,如果所示。....
1,234
2019/05/04
08
Oct
HTML Table实现表头固定
通常我们在制作一个可以滚动的表格时,都希望表头能够固定。但table标签并不能实现这个功能,所以我们可以用两个table来实现。代码如下<div class="table"> <div class="table-head"> <table> <colgroup> <col class="trow-1"/> <col class="trow-1&...
612
2018/10/08