html – 在bootstrap glyphicon上的链接

发布时间：2020-12-14 16:32:04 所属栏目：资源来源：网络整理

导读：我有以下rails代码 %= link_to mypath do % %= content_tag(:i,"",:class=' icon-eye-open' %% end %%= @num % 它生成html a href="/mypath" i class=" icon-eye-open"/i/a100 问题是,如jsfiddle here所示,当鼠标悬停在图标上时,数字和图标之间有一个下划线

我有以下rails代码

<%= link_to mypath do %>
    <%= content_tag(:i,"",:class=>' icon-eye-open' %>
<% end %>
<%= @num %>

它生成html

<a href="/mypath">
    <i class=" icon-eye-open"></i>
</a>
100

问题是,如jsfiddle here所示,当鼠标悬停在图标上时,数字和图标之间有一个下划线的空格.视觉目的需要空间,但如何在没有CSS的情况下删除链接的下划线？

为什么没有？我可以做文字装饰：没有;对于某些css选择器,特定的或通用的,但我想了解为什么会出现这种下划线.
如果删除了@num,则没有下划线,并且因为它在锚标记之外,所以它不应该影响它.然而,它显然确实如此.

解决方法

这是由于< / i>之后的空白而发生的.

尝试将jsFiddle中的代码切换为：

<a href="/mypath"><i class=" icon-eye-open"></i></a>100

问题就消失了.

这是因为< i> element是内联的(或者更确切地说是内联块),这意味着空格通常是重要的.

为了防止ERB在标记后使用尾随 – ％>关闭它,即：

<%= content_tag(:i,:class=>' icon-eye-open' -%>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!