展开和收起

（1.）创建一个css样式，

2

（2.）创建一个类，将row包裹住，给row一个id，再给单元格里面设置表格基础距离为0，给他类名，后面设置行（tr），表头（th）和表单（td），（可以设置多个表单）。

（3.）来到样式这边，先给单元格里面设置宽度百分之一百和颜色，再给第一个类里面设置：内边距（上右下左）上边12个像素，颜色为白色，框框的边角为5个圆角像素，盒子阴影为左右边的阴影和上下边的阴影，到阴影的模糊度，还有阴影的颜色。row里面设置高度为80像素，还有设置隐藏，最后是动画效果，名字和时间还有速度，最后一个是设置表格里面的样式，文字居中，高30像素，内边距上边5像素，有变10像素

（如果后面不给像素，他会默认前面两个距离和像素，不让其变化后面应该加个0）。

盒子下边有线条为1像素。

（4.）之后在源代码里面设置他的展开和收起的类和id，要被header包裹住。

（5.）给里面i标签设置：行内元素变块级，宽和高各位6和11像素，绝对定位，高3像素，左外边距5像素。

（6）给他的p标签文字居中效果，再弄个鼠标移入后会变成小手的效果。

（7.）收起要给他隐藏起来（毕竟是展开先出现，要不然收起和展开就会很乱）。

（8.）最后是js，也是核心，想要让他展开和收起只要改变他的高度即可。导入id，然后设置高度：

Zk.点击事件 =
function(){

Row.style.高度=80+“px”(开始高度)；

zk.style.display=“隐藏”

sq.style.display=“显示”；

}；

后面是反过来的

Sq.点击事件=function(){

Row.style.高度 =200+“px”；

Zk.style.display=“显示”；

Sq就会隐藏。

}