水平对齐不同位置的UL

<style>
    ul {
        float: left;
        margin-right: 10px; /* 可选，用于设置UL之间的间距 */
    }
</style>

<ul>
    <li>列表项1</li>
    <li>列表项2</li>
</ul>

<ul>
    <li>列表项3</li>
    <li>列表项4</li>
</ul>

<style>
    ul {
        display: inline-block;
        margin-right: 10px; /* 可选，用于设置UL之间的间距 */
    }
</style>

<ul>
    <li>列表项1</li>
    <li>列表项2</li>
</ul>

<ul>
    <li>列表项3</li>
    <li>列表项4</li>
</ul>

<style>
    .container {
        display: flex;
    }
    ul {
        margin-right: 10px; /* 可选，用于设置UL之间的间距 */
    }
</style>

<div class="container">
    <ul>
        <li>列表项1</li>
        <li>列表项2</li>
    </ul>

    <ul>
        <li>列表项3</li>
        <li>列表项4</li>
    </ul>
</div>