如何使用 HTML/CSS 创建数据切换？ [关闭]

【问题标题】：How can I create a data toggle with HTML/CSS? [closed]如何使用 HTML/CSS 创建数据切换？ [关闭]
【发布时间】：2014-09-17 02:21:00
【问题描述】：

我发布了我正在处理的布局图片的链接。我对 jQuery 和 JavaScript 没有任何经验；那么有没有办法可以用纯 HTML/CSS3 创建像这样的数据切换？

【问题讨论】：

【解决方案1】：

我认为纯 CSS 没有办法，因为 css 伪类只允许您检查按钮是否处于活动状态，就像当您按下它时尝试这个并按住它：

您可以为所有按钮指定不同的 id，例如 #button1、#button2、#button3

过滤器也有不同的#filter1、#filter2、#filter3

然后在你的 css 中做这样的事情

#button1:active ~ #filter1 {
 //your changes to the css
}

但这只是暂时的，如果您真的不想使用 JQuery，那么您可以尝试使用复选框并以更好的方式设置它们以满足您的需求，然后使用 ':checked' 伪类

点赞Here

对于关闭按钮，你不会只用 css 来制作它，如果你愿意，我可以给你 JQuery 代码:)

【讨论】：