前端之家收集整理的这篇文章主要介绍了
使元素自动适应父w / o表/ javascript的宽度，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
是否可以创建一个包含多个框的div,这些框
自动适应父(大小均匀)的大小,而不使用表或
Javascript？我意识到可以使用table-layout：fixed;但是我已经试图动画化,似乎没有很好的工作.下图是我的意思：
我正在尝试增加div内的一个框的宽度,然后将其余的框自动调整大小,所以所有的框均匀地适合div.我需要它是动画,不只是瞬间,在这种情况下,我只是使用一个表.我也使用Javascript实验,使用-webkit转换动画,但这并没有改变为非常好的动画效果.而不是扩大/减小大小,框似乎开始宽度为0px,然后拉伸到给定的大小. (这是使用表格布局的表：fixed.是否有纯CSS / HTML的方式来做到这一点,还是需要使用Javascript和/或表？
使用固定
数量的孩子可能没有表(虽然你需要表
显示),这里是我使用的CSS：
.parent{width:400px;height:100px;display:table}
.parent div{display:table-cell;border:1px solid #000;
-webkit-transition:width 1s;width:20%}
.parent:hover div{width:10%}
.parent div:hover{width:60%}
您需要手动计算百分比以获得最佳效果.演示：
http://jsbin.com/ubucod/1
原文链接：https://www.f2er.com/js/154371.html
