Question

我使用了How to target the href to 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;
}

我的问题是当我点击链接时，＆＃34;项目1＆＃34;在内容中出现在正确的位置。但内容消失了。

我该怎么办？

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

Answer 1

如果我正确理解您尝试做的事情，则使用:target属性无法做到这一点。目标始终是＃之后的URL的一部分，并且一次只能有一个目标。

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

如何将href定位到多个div？

1 个答案: