CSS ul li 如果删除 1 会使其他变大

Question

我的 ul 的高度是 500px。如何使 li 的高度动态变化为 li 的数量？例如，如果我有 5 个 li，则高度为 20%，如果有 4 个 li，则它变为 25%。

这是我尝试过的方法，但如果我从“开发者模式”中删除一个元素，高度不会改变。

ul{
    list-style:none;
    height:500px;
    width:100%;
    overflow:hidden;
}
li{
    width:100px;
    height:25%;
    background:red;
    border:1px solid black;
}

http://jsfiddle.net/crcb8/

Answer 1

一点点 jquery 就能满足您的需求，并且得到大多数浏览器和移动设备的支持

$(document).ready(function () {
     var x = $('li').siblings().length;
     var y = 100/x;
     $('li').css('height', y + '%');
});