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

Question

如果我有一个<%= link_to "BlueBottles" %>，如何更改CSS的部分内容，比如说，将前四个字母设为蓝色？

单独的链接看起来不正确，我担心我没有采取正确的方法来做到这一点。提前感谢您的帮助!!

Answer 1

由于你正在使用Rails助手，你会有这样的事情（记得用适当的Rails路由替换your_path）：

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

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

a > b {
  color: blue;
}

修改：根据Bastian Rang的建议将:em更改为:b。

Answer 2

如果你有以下链接

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

您可以将其更改为

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

CSS中的

和样式a > b {color:blue}

代替B-Element，您可以使用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; }