一个CSS HTML 的手风琴分页的问题
怎么样才能让这个手风琴效果有一个默认的打开页吗？
我想默认打开Popular Post
#accordion {
margin:0;
padding:0;
list-style:none;
}
#accordion li {
width: 485px;
}
#accordion li a {
display: block;
width: 485px;
height: 43px;
text-indent:-999em;
outline:none;
}
/* Using CSS Sprite for menu item */
#accordion li a.popular {
background:url(images/body.jpg) no-repeat 0 0;
}
#accordion li a.popular:hover, .popularOver {
background:url(images/body.jpg) no-repeat -268px 0 !important;
}
#accordion li a.category {
background:url(images/body.jpg) no-repeat 0 -43px;
}
#accordion li a.category:hover, .categoryOver {
background:url(images/body.jpg) no-repeat -268px -43px !important;
}
#accordion li a.comment {
background:url(images/body.jpg) no-repeat 0 -86px;
}
#accordion li a.comment:hover, .commentOver {
background:url(images/body.jpg) no-repeat -268px -86px !important;
}
/* Second Level UL List*/
#accordion ul {
background: rgb(53, 3, 7) repeat-y 0 0;
width:485px;
margin:0;
padding:0;
display:none;
}
#accordion ul li {
height:30px;
}
/* styling of submenu item */
#accordion ul li a {
width: 485px;
height:25px;
margin-left:15px;
padding-top:5px;
border-bottom: 1px dotted #777;
text-indent:0;
color:#ccc;
text-decoration:none;
}
/* remove border bottom of the last item */
#accordion ul li a.last {
border-bottom: none;
}
<div>
<ul id="accordion" >
<li>
<a href="#" class="item popular" rel="popular">Popular Post</a>
<ul>
三国故事
</ul>
</li>
<li>
<a href="#" class="item category" rel="category">Category</a>
<ul>
<li><a href="#">Category 1</a></li>
<li><a href="#">Category 2</a></li>
<li><a href="#" class="last">Category 3</a></li>
</ul>
</li>
<li>
<a href="#" class="item comment" rel="comment">Recent Comment</a>
<ul>
<li><a href="#">Comment 1</a></li>
<li><a href="#">Comment 2</a></li>
<li><a href="#" class="last">Comment 3</a></li>
</ul>
</li>
</ul>
</div>
