如何使两个单独的无序列表项的高度相同？

要使两个单独的无序列表项的高度相同，可以通过以下方法实现：

使用CSS的flexbox布局：将两个无序列表项包裹在一个父容器中，设置父容器的display属性为flex，然后设置列表项的flex属性为1。这样，两个列表项将会自动平分父容器的高度，从而使它们的高度相同。

<style>
    .container {
        display: flex;
    }
    .item {
        flex: 1;
    }
</style>

<div class="container">
    <ul class="item">
        <li>列表项1</li>
        <li>列表项2</li>
        <li>列表项3</li>
    </ul>
    <ul class="item">
        <li>列表项4</li>
        <li>列表项5</li>
    </ul>
</div>

使用JavaScript动态设置高度：通过JavaScript获取两个列表项的高度，然后将较短的列表项的高度设置为与较长的列表项相同。这可以通过DOM操作和计算来实现。

<script>
    var list1 = document.getElementById("list1");
    var list2 = document.getElementById("list2");
    
    var height1 = list1.offsetHeight;
    var height2 = list2.offsetHeight;
    
    if (height1 > height2) {
        list2.style.height = height1 + "px";
    } else if (height2 > height1) {
        list1.style.height = height2 + "px";
    }
</script>

<ul id="list1">
    <li>列表项1</li>
    <li>列表项2</li>
    <li>列表项3</li>
</ul>
<ul id="list2">
    <li>列表项4</li>
    <li>列表项5</li>
</ul>

以上两种方法都可以实现使两个单独的无序列表项的高度相同。具体选择哪种方法取决于具体的需求和使用场景。

腾讯云相关产品和产品介绍链接地址：