为什么 twitter-bootstrap 不使用图像，而是使用 <span class= "icon-bar" ></span>？

Question

Boostrap3 使用此代码在移动视图中的导航栏中制作切换按钮，但为什么不只使用图像而不是空元素呢？

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
  <span class="sr-only">Toggle navigation</span>
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
</button>

http://getbootstrap.com/components/#navbar

Answer 1

最有可能保持对网页设计的"前瞻性"思维方法。如果仅使用 html 和 css 可以实现相同的视觉效果，则没有理由提出不必要的媒体请求。同样，css的进步也允许曾经只能用javascript或flash实现的过渡。

如果您检查该移动菜单图标的html，则很明显它在做什么，以及即使是小图像的加载也需要比少量标记更多的处理。简而言之，这只是现代设计中更好的方法。