一般网页上的展开和收缩效果都要用到js代码，实现起来比较麻烦，现在有一种方法不用写一句js代码，就能实现绚丽的展开和收缩效果。那就是使用CollapsiblePanelExtender控件，该空间属于微软的atlas，下载地址
http://atlas.asp.net/default.aspx?tabid=47&subtabid=471
首先要在页面上至少添加两个panel，第一个panel用来放标题，第二个panel用来放内容，当鼠标点击第一个panel时，就能控制第一个panel的展开和收缩，最基本的代码如下：
<cc1:CollapsiblePanelExtender ID="CollapsiblePanelExtender1"
runat="server">
<cc1:CollapsiblePanelProperties
CollapseControlID="Panel1"
ExpandControlID="Panel1"
TargetControlID="Panel2" />
</cc1:CollapsiblePanelExtender>
属性TargetControlID指的被控制的panel，这里为panel2
属性ExpandControlID指的是控制展开的panel，这里为panel1，就是说点击panel1时会展开panel2
属性CollapseControlID指的时控制收缩的panel，这里是panel1。
这三个是最基本也是最常用的属性，还有很多其它属性，灵活使用这些属性可实现很多很炫的功能，下面就简单介绍一下其它属性。
TargetControlID：被控制的panel
CollapsedSize：目标收缩后的大小
ExpandedSize：目标展开后的大小
Collapsed：true时为展开，false时为收缩
Scroll Contents:值为true时，且目标panel的大小小于内容的大小时自动添加滚动条。
ExpandControlID/CollapseControlID：点击这些控件会展开或收缩目标panel。
TextLabelID：指示一个label控件的ID，该label的值会根据目标panel的状态而改变。
CollapsedText：设置当目标panel为收缩时TextLabelID所指示的lable的值。
ExpandedText：设置当目标panel为展开时TextLabelID所指示的lable的值。
ImageControlID：指示一个image控件。该控件会根据目标panel状态的不同而改变图片。
CollapsedImage：指示目标panel为收缩时ImageControlID所指示的image的path。
ExpandedImage：指示目标panel为展开时ImageControlID所指示的image的path。
ExpandDirection：指示目标panel的展开收缩方向，可以是水平或垂直展开收缩。