如何选择导致以“/ foo-bar”结尾的网址的链接？

Question

我想使用基于标签的自定义颜色在SE上设置一些标签，仅使用CSS。

这不应该太难，因为：

<a href="/questions/tagged/foo-bar" class="post-tag" title="" rel="tag">foo-bar</a>

...应该可以使用选择器轻松匹配，例如：

a.post-tag[href$=/foo-bar]

...需要使用斜杠来匹配foo-bar而不是baz-foo-bar。

但事实并非如此简单。破折号和斜线似乎都阻止选择器工作。幸运的是，我可以通过escaping字符解决这个问题，因此/变为\5c而-变为\2d。

但这似乎与任何东西都不匹配：

a.post-tag[href$=\5cfoo\2dbar]

...而a.post-tag[href$=foo\2dbar] 确实有一些匹配，但又有太多匹配。

如何使用CSS选择以“/ foo-bar”结尾的href？

Answer 1

简单地将属性选择器中的值包含在引号中，这样您就不需要转义任何内容，就像在HTML中引用属性值一样：

a.post-tag[href$="/foo-bar"]

jsFiddle preview