跨度标记在Drupal Bootstrap子主题中显示为文本

Question

这是我从未见过的东西，span标记显示为a标记中的文本。

如果我修改链接的一个字母，然后按萤火虫输入，span被正确解释为HTML。

我为Drupak 7使用Bootstrap主题，将它用作父主题。

这个问题可以在http://jsfiddle.net/wa5z3L7j/看到，但我禁用了每个CSS，它仍然显示为文本。

这是萤火虫控制台：

这是它是如何看出：

CSS应用于a元件：

*::after, *::before { 
    box-sizing: border-box; 
} 
.sf-arrows .sf-with-ul::after { 
    -moz-border-bottom-colors: none; 
    -moz-border-left-colors: none; 
    -moz-border-right-colors: none; 
    -moz-border-top-colors: none; 
    border-color: rgba(255, 255, 255, 0.5) transparent transparent; 
    border-image: none; 
    border-style: solid; 
    border-width: 5px; 
    content: ""; 
    height: 0; 
    margin-top: -3px; 
    position: absolute; 
    right: 1em; 
    top: 50%; 
    width: 0; 
} 
*::after, *::before { 
    box-sizing: border-box; 
} 
.header .nav__primary .sf-menu > li > a { 
    border: medium none; 
    text-transform: uppercase; 
} 
.navbar-default .navbar-nav > li > a { 
    color: #777; 
} 
.sf-arrows .sf-with-ul { 
    padding-right: 2.5em; 
} 
.sf-menu > li > a { 
    color: #6f6f6f; 
    font: 13px/18px Ubuntu; 
} 
.navbar-nav > li > a { 
    padding-bottom: 15px; 
    padding-top: 15px; 
} 
.navbar-nav > li > a { 
    line-height: 20px; 
    padding-bottom: 10px; 
    padding-top: 10px; 
} 
.nav > li > a { 
    display: block; 
    padding: 10px 15px; 
    position: relative; 
} 
.sf-menu a { 
    color: #13a; 
} 
.sf-menu a { 
    border-left: 1px solid #fff; 
    border-top: 1px solid rgba(255, 255, 255, 0.5); 
    padding: 0.75em 1em; 
    text-decoration: none; 
} 
.sf-menu a { 
    display: block; 
    position: relative; 
} 
.sf-menu, .sf-menu * { 
    list-style: outside none none; 
    margin: 0; 
    padding: 0; 
} 
a { 
    color: #337ab7; 
    text-decoration: none; 
} 
a { 
    background-color: transparent; 
} 
* { 
    box-sizing: border-box; 
} 

娜直条的代码：

<div class="navbar-collapse collapse"> 
          <nav class="nav nav__primary clearfix" role="navigation"> 
                    <ul class="menu nav sf-menu navbar-nav sf-js-enabled sf-arrows"><li class="first leaf active"><a class="active" href="/drupal7/">Principal</a></li> 
<li class="leaf"><a data-scroll="" data-target="#comunicaciones-internas" href="/drupal7/comunicaciones-internas">Comunicaciones Internas</a></li> 
<li class="leaf"><a data-scroll="" data-target="#accesos-sistemas" href="/drupal7/accesos-sistemas">Accesos a Sistemas</a></li> 
<li class="last leaf"><a data-scroll="" data-target="#agenda-contactos" href="/drupal7/agenda-contactos">Agenda de Contactos</a></li> 
</ul>                         <ul class="menu nav sf-menu navbar-nav secondary sf-js-enabled sf-arrows"><li class="first last expanded dropdown"><a href="/drupal7/user" class="sf-with-ul">Mi cuenta &lt;span class="caret"&gt;&lt;/span&gt;</a><ul class="dropdown-menu" style="display: none;"><li class="first last leaf"><a href="/drupal7/user/logout">Cerrar Sesión</a></li> 
</ul></li> 
</ul>                       </nav> 
         </div> 

编辑：我看到在的jsfiddle不到和刨丝器比符号被解释为HTML代码，而不是，我会检查源代码。也许有一些与charset有关的东西。

编辑2：

（液）

如果你有这个问题，我已经研究过的Drupal的 'L' 的功能，看到有人检查第三个参数中的html选项，否则会输出转义字符串。

https://api.drupal.org/api/drupal/includes!common.inc/function/l/7

所以，我在function MYTHEME_menu_link(array $variables)功能，生成的链接时添加的$opcionesLink['html'] = true;。

Answer 1

这是由于下面的代码：

Mi cuenta <span class="caret"></span> 
<!--------^^^^------------------^^^^^^^^-----^^^^ 

<的将被解释为<和>将被解释为>。请确保您在上线前清理代码。将其更改为：

Mi cuenta <span class="caret"></span>