如何将href定位到多个div？

Question

我使用了如何将href定位到div 以将href定位到div所示的方法.有效.但我需要增加另一个级别.

HTML

<ul >
    <li class="active"><a href="#m1">home</a></li>
    <li><a href="#m2">settings</a></li>
</ul>

<div class="target">
    <div id="m1">
        <ul >
            <li class="active"><a href="#subm1-1" title="Home1">Item1</a></li>
            <li><a href="#subm1-2">Item 2</a></li>
        </ul>
    </div>

    <div id="m2">
        <ul>
            <li class="active"><a href="#subm2-1" title="Home1">Item1</a></li>
            <li><a href="#subm2-2">Item 2</a></li>
        </ul>
    </div>
</div>

<div class="target123">
    <div id="subm1-1">
        content1
    </div>
    <div id="subm1-2">
        content2
    </div>
    <div id="subm2-1">
        content3
    </div>
    <div id="subm2-2">
        content4
    </div>
</div>

CSS

.target > div {
    display:none;
}

.target > div:target{
    display:block;
}


.target123 > div {
    display:none;
}

.target123 > div:target{
    display:block;
}

我的问题是,当我点击链接时,内容中的"项目1"出现在正确的位置.但内容消失了.

我怎么能阻止这个？

我的divs彼此相邻.所以一个div不会与另一个div重叠.

Answer 1

如果我理解你正在尝试做什么,使用该:target属性是不可能的.目标始终是#之后的URL的一部分,并且一次只能有一个目标.

这意味着无论何时激活目标,所有其他元素都将再次被隐藏.您无法使用此方法同时基于两个不同的目标显示内容.