CSS基础测试(布局相关)

实现如下图所示的布局效果:

布局要求

• HTML 选择合理
• 视觉还原良好
• 支持点击展开的交换效果(无 JS)
• 代码干净整洁,缩进良好

下面请开始你的表演~

方法 1:

input[type=”checkbox”]实现

demo 地址:

访问 demo 页面

方法 2:

details,summary标签实现,(也是本题出题的本意)

demo 地址:

访问 demo 页面