我有一个项目符号列表，如下所示：
<ul>
<li>
text1 here
</li>
<li>
text2 here
</li>
<li>
text3 here
</li>
<li>
text4 here
</li>
<li>
text5 here
</li>
<li>
text6 here
</li>
<li>
text7 here
</li>
</ul>
我只显示前3个项目符号，但在底部有一个链接，如果点击，可以显示其余部分（手风琴式效果）。理想情况下，我也会有一个紧密的链接，在它被扩展后再次压缩它。
用PHP&我可以只用CSS来做这件事吗？
感谢
好吧，我不认为PHP真的是你想要的答案。这感觉更适合前端。看看谷歌的"javascript手风琴"结果，它将详细说明如何最好地做到这一点。
话虽如此，您可以使用严格的CSS来实现这一点，但它是CSS3，可能还没有得到广泛支持。可以查看本教程/关于:target伪类的文章。
可以在PHP和CSS中执行此操作，方法是将脚本设置为响应URL参数，该参数在要隐藏或显示的菜单片段上切换活动/非活动类。然后，编写基于类显示/隐藏的CSS规则就很简单了。但是，请记住，这可能意味着往返于服务器，只是为了折叠菜单。
使用JS可以很容易地做到这一点。
首先将基本HTML更改为
<ul>
<li id="myli1">
text1 here
</li>
<li id="myli2">
text2 here
</li>
<li id="myli3">
text3 here
</li>
<li id="myli4" style="display:none;">
text4 here
</li>
<li id="myli5" style="display:none;">
text5 here
</li>
<li id="myli6" style="display:none;">
text6 here
</li>
<li id="myli7" style="display:none;">
text7 here
</li>
</ul>
然后包括一个类似的功能
function ShowMyLi(fromnr,displaystyle) {
var o=document.getElementById("myli"+fromnr);
if (!o) return;
o.style.display="block";
var cmd="ShowMyLi("+(fromnr+1).toString()+",'"+displaystyle+"');";
window.setTimeout(cmd,150);
}
- 在"显示更多"按钮上执行
onclick="ShowMyLi(4,'block');" - 在"隐藏更多"按钮上执行
onclick="ShowMyLi(4,'none');"
要隐藏在其中的组链接示例
<li>Text 1</li>
<li>Text 2</li>
<li>Text 3</li>
<li class="hidden">
<ul>
<li>Text 4</li>
<li>Text 5</li>
<li>Text 6</li>
</ul>
</li>
并使用jQuery将手风琴连接到
jQuery(document).ready(function(){
$('a#trigger').click(function() {
$('li ul.hidden').next().toggle('slow');
return false;
});
});
当然，你必须展示：没有；到.隐藏类http://docs.jquery.com/UI/Accordion
PHP是一种服务器端语言，您正在寻找的是客户端解决方案。Mootools有一个Slide函数，你可以很容易地使用它，也可以尝试JQuery解决方案。下面是一个有趣的列表：）