实现弹性盒子其他行两端对齐，最后一行左对齐

实现原理：获取到最后一个盒子元素，给其设置一个 margin-right属性

效果图

HTML

<ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>

CSS

       ul {
            width: 100%;
            padding: 0;
            margin: 0;
            margin-top: 200px;
            list-style: none;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
        }

        li {
            width: 30%;
            height: 40px;
            border-radius: 4px;
            margin-bottom: 20px;
            border: 1px solid rgb(167, 182, 240);
        }
        // 本示例盒子的数量为 11 个，故 nth-child 写的是11，各位看官可以根据自己盒子的具体数量来设置这个值
        li:nth-child(11) {
            margin-right: calc(100% - 65%);
        }