max-height与任意高度元素滑动展开收起效果实例页面

展示

个人觉得,display:table-cell最强的应用是可以任意个数列表的等宽效果。

display:table-cell其他一些应用,例如,两栏自适应布局,垂直居中效果等等都是可以通过其他技术手段模拟出来的,但是,根据列表个数自动等宽的效果,其他CSS是很难模拟的,尤其当需要兼容IE8浏览器的时候。

个人觉得,display:table-cell最强的应用是可以任意个数列表的等宽效果。

display:table-cell其他一些应用,例如,两栏自适应布局,垂直居中效果等等都是可以通过其他技术手段模拟出来的,但是,根据列表个数自动等宽的效果,其他CSS是很难模拟的,尤其当需要兼容IE8浏览器的时候。

然而,此方法也有局限性,就是只能实现单行列表的等分,所以,如果我们希望列表数目超过一定值的时候变成多行,就需要根据数目不同,输出不同的DOM结构,仅仅靠CSS有难度。

代码