html – 在bootstrap glyphicon上的链接

前端之家收集整理的这篇文章主要介绍了html – 在bootstrap glyphicon上的链接前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有以下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' -%>

猜你在找的HTML相关文章