如何实现固定高度的ul中，li元素的底部对齐

今天在做项目中（移动端页面 效果图为宽度720px    设置html font-size:72px），突然间被一个小问题困扰了一下下，不知道大家有没有遇到过：

ul高度100px li中的背景图片宽高均为12px.li的位置距离ul的下部高度26px.

此时要实现图片效果，我采用的办法是利用line-height.

设置ul的样式为：

{
    position: absolute;
    z-index: 99;
    height: 1.389rem;
    line-height: 2.056rem;
    width: 100%;
    bottom: 0;
    background: -webkit-linear-gradient(top,rgba(204,204,204,0),rgba(0,0,0,1));
    text-align: right;
    

}

设置li的样式为：

    display: inline-block;
    width:0.167rem;
    height: 0.167rem;

    background:url(../images/index/dot.png) no-repeat;

其中关键的样式为：ul的line-height:2.056rem;

计算思路及方法：

在进行对齐操作时，如果ul的高度和ul的行高一致，则实现的效果是li元素在ul的垂直居中位置。按照这个思路，如果li元素要在ul的底部,则行高需要时高度的两倍。 若li元素距离底部为26rem的情况，则行高的设置为：(ul的高度-26px)*2。