就在我撰写本书期间,Chrome和Safari浏览器给<details>元素新增了name属性,这个属性的作用是,如果多个<details>元素设置了相同的name属性值,则这些<details>元素之间会形成互斥关系,即同一时间只有一个<details>元素可以展开,其他的<details>元素会自动收起。
这个特性非常适合实现手风琴效果,例如,下面的HTML代码:
此时,<details>元素每次最多只有一个是展开的,效果如图3-12所示。
图3-12 <details>元素手风琴效果
这是很棒的特性,静待现代浏览器全面支持。