css - 我如何设计用于过滤的链接菜单，例如 Facebook 上的 'Dean + Friends' 'Just Dean' 'Just Friends'？

Question

我们的电子商务网络应用程序中的多个页面允许用户过滤他们提交给我们的请求的状态列表。

过滤器通常是这样的:

所有待完成

我们将它们设置为链接。我们想设置它们的样式，以便当前事件的过滤器用彩色矩形突出显示(带有圆 Angular ，自然!)并且文本变为白色。

矩形突出显示将一直保留，直到用户单击其他过滤器之一(待处理、已完成)，此时突出显示将移动到刚刚单击的链接。

这方面的一个例子出现在 Facebook 的几个地方，例如，墙上的帖子被过滤到:

Dean+Friends Just Dean Just Friends

在 CSS 中是否有一种直接的方法可以做到这一点，也许是通过设置最近“访问过”的链接的样式，但将之前访问过的链接标记为未访问过？

谢谢，

院长理查森

Answer 1

Is there a straightforward way to do this in CSS, perhaps by styling the most-recently 'visited' link but marking previously-visited ones as unvisited?

您无法使用纯 CSS 产生这种效果的动态效果。 Facebook 通过添加一个带有 Javascript 的 CSS 类来做到这一点，当您单击其中一个 pill-tab 按钮时会触发该类。 CSS 类包含使其以所需方式显示的样式规则。