我有一个简单的导航菜单,其中包含针对不同页面的纯 html 链接。所有这些页面都共享这个菜单,该菜单被分成部分。
我希望当前页面的链接以粗体突出显示。我的(非工作)实现的通用版本如下所示:
# 'pagetwo' view
<%= render :partial => "shared/nav" %>
# partial
<%= link_to "Home", home_url, :id => "home" %>
<%= link_to "Page 1", pageone_url, :id => "pageone" %>
<%= link_to "Page 2", pagetwo_url, :id => "pagetwo" %>
我可以用 JavaScript 解决这个问题吗?
<小时 />link_to_unless_current
建议似乎有效。有谁知道如何使用此方法为每个结果分配不同的 CSS 类?
请您参考如下方法:
除非您需要更改页面请求之间链接的粗体程度(即响应客户端事件),否则您可能会考虑使用 block 形式 link_to_unless_current或者,对于更通用的解决方案,请查看 current_page?
另一个选择可能是根据当前页面向正文(或类似的容器元素)添加类,然后编写 CSS 规则以定位特定上下文中的链接。例如:
body.home a#home_link { font-weight: bold }
body.about a#about_link { font-weight: bold }