* {
padding:0;
margin:0;
}
.menu {
width:200px;
height:auto;
margin:100px auto;
}
.item {
width:100%;
height:auto;
}
.item > h3 {
height:40px;
line-height:40px;
background-color:#7dffe7;
color:orange;
border-bottom:2px solid #ccc;
padding-left:10px;
}
.item > .itembox {
width:100%;
height:0px;
overflow:hidden;
/*display:none;
*/
/*添加过渡效果:过渡效果只能产生从某个值到另外一个具体的值的过渡*/
/*1.一定要设置为哪些css样式添加过渡效果*/
/*transition-property:display;
*/
transition-property:height;
/*2.一定要设置过渡效果的耗时*/
transition-duration:1s;
}
.item > .itembox > ul {
list-style:none;
background-color:#eaffb6;
padding:10px;
}
/*为item添加hover伪类*/
.item:hover > .itembox {
/*display:block;
*/
height:110px;
}