高效-3根据个数显示不同的样式

有1-3个item显示在同一行，但是item的个数不一定，如果只有一个，那这个item占宽100%，有2个时每一个占50%，3个时每个占33%。
这个需求可以用js计算，但是能用html／css解决的问题就不要用js。

<ul>
 <li>1111111111111111</li>
 <li>222222222222</li>
 <li>3333333333333</li>
</ul>
<style>
    li{
        width: 100%;
        background: red;
    }
    li:first-child:nth-last-child(2),li:first-child:nth-last-child(2) ~ li{
         width: 50%;
        background: green;
    }
    li:first-child:nth-last-child(3),li:first-child:nth-last-child(3) ~ li{
         width: 33%;
        background: blue;
    }
</style>

1个时 2个时 3个时