1

我有以下代码：

<style>
.temp {
    transition:all 1s ease;
    opacity: 0;
    /* Don't forget the vendor specific pre-fixes! */
}

/* .temp:first-child{opacity: 1;} */

.temp:target {
    opacity: 1;
    font-size:40px;
}

#one:target {
  opacity: 1 ;
   font-size:40px
}
/*.tab:target ~ #one { opacity: 1;} */
</style>
<body>

<a href="#one">One</a>
<a href="#two">Two</a>
<a href="#three">Three</a>
<a href="#four">Four</a>

<div class="buttons">
    <div class="temp" id="one"> Number One</div>  
    <div class="temp" id="two">Number Two</div>  
    <div class="temp" id="three">Number Three</div>  
    <div class="temp" id="four">Number Four</div>
</div>

任务是使用 CSS 属性 {opacity:1;} 为 div #one 设置“默认”状态，仅在页面加载时使用 CSS。

我也找到了这个话题。 默认：目标与 CSS

这段代码也很好用。

window.onload = function(){
    if(document.location.hash="#"){
        document.location.hash="#one";
    }
}

但是如果我有多个：target，不确定它是否适用于具有 :target 状态的两个 div。

可能吗？感谢您的关注和解答。

4

0 回答 0