1

嗨朋友我:targetCSS下面使用的是我的代码

CSS

.acco h3 + div{height:0px; overflow:hidden;}
.acco : target h3 + div {
    border: 2px solid red;
    height:100px;

HTML

<div class="acco">
<h3>show</h3>
  <div class="test">test</div>

  <div class="click" ><a href="#show">click</a></div>
</div>

我的目标是<div class="test">test</div>,但它不起作用请帮助我

提前致谢...

4

3 回答 3

4

首先,您缺少#show标记中的锚点(并且取决于位置),需要对 css 进行调整(在每种情况下,您的伪类中都不能有空格:target):

<div class="acco" id="show">
/* css: no spaces*/
.acco:target h3 + div {

<!-- or -->

<div class="acco">
<h3 id="show">show</h3>

/*css: space between .acco and :target!*/
.acco :target + div {

演示(第一版)

于 2013-07-01T13:14:12.697 回答
3

尝试

.acco:target h3 + div {
    border: 2px solid red;
    height:100px;
}

没有空格

于 2013-07-01T13:07:43.637 回答
3

您可能最熟悉的伪类是:hover,它允许您声明将在用户将鼠标悬停在元素上时激活的特殊样式。:target伪类同样允许基于特定场景激活的自定义样式。

:target是一个类似于 的伪选择器:hover,中间不应该有空格。

很好的在这里阅读

于 2013-07-01T13:14:10.797 回答