CSS如何利用-checked实现纯CSS手风琴折叠_通过状态选择器控制区域高度:checked无法直接控制height动画,因它不产生可动画尺寸且height:auto不可过渡;需用max-height模拟,配合id/for精准关联及:checked~.content兄弟选择器,并排除移动端点击遮挡等陷阱。为什么 :checked 不能直接控制 height 动画因为 :checked 是表单控件(如 <input type="checkbox">)的状态伪类,它本身不产生可动画的尺寸属性;你无法对 height: auto 做 CSS 过渡——浏览器不知道“auto”该过渡到多高