下图是一个Accordion组件，请用HTML+CSS实现其UI,并用面向对象的思路把折叠效果的JS实现。如果能用纯css的方式实现其折叠效果更佳。 HTML: CSS: JS:
CSS:
* {
margin: 0;
padding: 0;
}
li {
background: #eee;
line-height: 24px;
display: block;
position: relative;
}
li a {
background: #ddd;
line-height: 24px;
display: block;
}
ul li input[type="checkbox"] {
position: absolute;
top: 0;
width: 100%;
height: 24px;
opacity: 0;
}
ul li input[type="checkbox"]:not(:checked) + ul {
display: none;
}
HTML:
