Javascript 以图形形式增长列表项

我有一个列表，列表项使用JavaScript动态增长，直到100%。这很有效。 但我想让它看起来像

所以我的问题是。我怎样才能让它们长到顶端。我试着增加身高，但后来他们长到了谷底。同样，用CSS旋转它们也不起作用，因为添加的列表项越多，列表就越向底部移动

有人知道吗

---

谢谢

对

li

-元素使用绝对定位。例如：

---

您需要在元素上使用绝对定位，引用'bottom:'属性，然后调整它们的高度将导致它们在@jib中“长大”。此外，建议对小部件的顶部容器使用

相对
定位，以便在定位小部件本身时有更多的控制权。没问题！如果你愿意，你可以接受这个解决方案。看一看常见问题：你不能点击“向上投票”项下的勾号吗？不过，没问题，很高兴能帮助您！：）
ul{
    height:300px;
    border:1px solid #666;
    position:relative;
}
li{
    display:inline-block;
    width:20px;
    position:absolute;
    bottom:0px;
    background-color:green;
}
#a{
    height:50%;
    margin-left:30px;
}
#b{
    margin-left:80px;
    height:10%;
}
#c{
    margin-left:130px;
    height:90%
}