css - 如何仅在 link_to 链接的一部分上更改 css？

Question

如果我有 a <%= link_to "BlueBottles" %>，我如何只更改其中一部分的 CSS，例如，将前四个字母变为蓝色？

单独的链接看起来不正确，恐怕我在正确的方法上做得不够。提前感谢您的帮助！！

Answer 1

由于您使用的是 Rails 助手，因此您将拥有类似这样的内容（请记住替换your_path为适当的 Rails 路线）：

<%= link_to content_tag(:b, 'Blue') + 'Bottles', your_path %>

然后是你的 CSS，就像在 Bastian Rang 的回答中一样：

a > b {
  color: blue;
}

编辑：更改:em为:b按照 Bastian Rang 的建议。

Answer 2

如果您点击以下链接

<a href="http://www.stackoverflow.com">BlueBottles</a>

您可以将其更改为

<a href="http://www.stackoverflow.com"><b>Blue</b>Bottles</a>

和a > b {color:blue}CSS 中的样式

代替 B 元素，您可以使用em,strong甚至i

Answer 3

有一个块形式link_to，我认为这是您想要使用它的情况：

<%= link_to your_path do %>
  <span class='special_anchor_part'>Blue</span>Bottles
<% end %>

然后 css ：

.special_anchor_part{ color:blue; }