我无法将glyphicons应用于我的i类。不知道为什么。我的代码是:
我的HTML(测试用例减少了80%):
<div id="categorymenu">
<nav class="subnav">
<ul id="nav" class="nav-pills categorymenu">
<li><a href=" //rsatestamle.dminsite.com/CategoryList.aspx" title="Categories" alt="Categories">Categories <i class=".icon-arrow-down .icon-white"></i></a>
<div>
<ul id="nav">
<li>
<a href="http://rsatestamle.dminsite.com/made-in-the-u+s+a/c/USA_2012/">
Made in the USA</a>
</li>
</ul>
</div>
</li>
<li>
<a href=" //rsatestamle.dminsite.com/brands.aspx" title="Brands" alt="Brands">Brands</a>
</li>
</ul>
</nav>
</div>
我的CSS直接来自Bootstrap.css(版本2.3.2)本身:
[class^="icon-"],[class*=" icon-"]{display:inline-block;width:14px;height:14px;*margin-right:.3em;line-height:14px;vertical-align:text-top;background-image:url("http://cdnll.amleo.com/images/art/glyphicons-halflings.png");background-position:14px 14px;background-repeat:no-repeat;margin-top:1px;}
.icon-white,.nav-pills>.active>a>[class^="icon-"],.nav-pills>.active>a>[class*=" icon-"],.nav-list>.active>a>[class^="icon-"],.nav-list>.active>a>[class*=" icon-"],.navbar-inverse .nav>.active>a>[class^="icon-"],.navbar-inverse .nav>.active>a>[class*=" icon-"],.dropdown-menu>li>a:hover>[class^="icon-"],.dropdown-menu>li>a:focus>[class^="icon-"],.dropdown-menu>li>a:hover>[class*=" icon-"],.dropdown-menu>li>a:focus>[class*=" icon-"],.dropdown-menu>.active>a>[class^="icon-"],.dropdown-menu>.active>a>[class*=" icon-"],.dropdown-submenu:hover>a>[class^="icon-"],.dropdown-submenu:focus>a>[class^="icon-"],.dropdown-submenu:hover>a>[class*=" icon-"],.dropdown-submenu:focus>a>[class*=" icon-"]{background-image:url("http://cdnll.amleo.com/images/art/glyphicons-halflings-white.png");}
.icon-arrow-down{background-position:-312px -96px;}
然而,唯一应用的风格来自我的style.css http://rsatestamle.dminsite.com/Styles/style.css
所以我不确定如何在这一点上使用glyphicons。我觉得这很简单:/不确定我做错了什么。看起来很容易。