html 可折叠的表格,html5 – 使用HTML和CSS的可折叠列表

我有一个可折叠的列表实现使用

HTML和CSS.列表工作正常,但我需要一些修改.

每当我点击列表中的一个项目,它将展开.但是当我点击同一列表中的另一个项目时,先前展开的元素会在被点击的元素展开时收缩.

请帮助我应用可以同时扩展多个列表项的行为.

我希望它只能在HTML和CSS中完成.

这是我目前的实现. CSS样式：

.row { vertical-align: top; height: auto !important; }

list { display: none; }

.show { display: none; }

.hide:target + .show { display: inline; }

.hide:target { display: none; }

.hide:target ~ .list { display:inline; }

@media print { .hide,.show { display: none; } }

和HTML标记：

Expand

Collapse

• Item 1
• Item 2
• Item 3