bootstrap 导航栏中的字体图标使用哪个元素
Which element to use for font icons in bootstrap navbar
Bootstrap 3 导航栏使用 glyphicons 和 Font Awesome 图标，如下面的 html 所示。
Bootstrap 手册推荐使用跨度元素：
<span class="fa fa-pencil-square-o" aria-hidden="true"></span>
FontAwesome网页推荐使用i元素：
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
使用 i 元素使图标比使用 span 更大。越大越好看。
字体图标应使用哪个元素？
<div id="sidebar-left" class="col-md-2">
<div class="navbar-collapse sidebar-nav">
<ul class="nav nav-tabs nav-stacked main-menu">
<li>
<a href='OpenInvoice'>
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
<span>Invoice</span>
</a>
</li>
ASP.NET服务器使用MVC4。
Using i element makes icon bigger than using span
这个论点没有实际意义，因为 Font-Awesome 的图标是基于字体的，可以使用 CSS 的 font-size 属性 手动调整大小。这意味着您可以自己覆盖图标的大小，无论您使用哪个元素。
我应该搭配哪个元素？
围绕哪个元素最适合使用存在一些争论（参见 Should I use <i> tag for icons instead of <span>?），但忽略语义，重要的是要注意 Font-Awesome 图标包含在伪元素中（特别是 ::before) - 因此除非它不支持伪元素（例如 input 元素），否则使用哪个元素并不重要。
HTML 规范说明了什么？
遗憾的是，规范并未告诉我们可以使用基于字体的图标做什么，但关键点是：
<span>
The span element doesn't mean anything on its own, but can be useful when used together with the global attributes, e.g. class, lang, or dir. It represents its children.
<i>
The i element represents a span of text in an alternate voice or mood, or otherwise offset from the normal prose in a manner indicating a different quality of text, such as a taxonomic designation, a technical term, an idiomatic phrase from another language, transliteration, a thought, or a ship name in Western texts.
你可以从中做你想做的。
Bootstrap 3 导航栏使用 glyphicons 和 Font Awesome 图标，如下面的 html 所示。 Bootstrap 手册推荐使用跨度元素：
<span class="fa fa-pencil-square-o" aria-hidden="true"></span>
FontAwesome网页推荐使用i元素：
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
使用 i 元素使图标比使用 span 更大。越大越好看。
字体图标应使用哪个元素？
<div id="sidebar-left" class="col-md-2">
<div class="navbar-collapse sidebar-nav">
<ul class="nav nav-tabs nav-stacked main-menu">
<li>
<a href='OpenInvoice'>
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
<span>Invoice</span>
</a>
</li>
ASP.NET服务器使用MVC4。
Using
ielement makes icon bigger than using span
这个论点没有实际意义，因为 Font-Awesome 的图标是基于字体的，可以使用 CSS 的 font-size 属性 手动调整大小。这意味着您可以自己覆盖图标的大小，无论您使用哪个元素。
我应该搭配哪个元素？
围绕哪个元素最适合使用存在一些争论（参见 Should I use <i> tag for icons instead of <span>?），但忽略语义，重要的是要注意 Font-Awesome 图标包含在伪元素中（特别是 ::before) - 因此除非它不支持伪元素（例如 input 元素），否则使用哪个元素并不重要。
HTML 规范说明了什么？
遗憾的是，规范并未告诉我们可以使用基于字体的图标做什么，但关键点是：
<span>The
spanelement doesn't mean anything on its own, but can be useful when used together with the global attributes, e.g.class,lang, ordir. It represents its children.
<i>The
ielement represents a span of text in an alternate voice or mood, or otherwise offset from the normal prose in a manner indicating a different quality of text, such as a taxonomic designation, a technical term, an idiomatic phrase from another language, transliteration, a thought, or a ship name in Western texts.
你可以从中做你想做的。