用于非输入的Bootstrap input-group-addon图标

Question

Bootstrap有一个内置的按钮图标：http://getbootstrap.com/components/#input-groups

我想知道是否可以保留这种风格的图标，但不能用于输入？例如，我想让一个图标以相同的样式显示为面板标题的一部分：http://getbootstrap.com/components/#panels，并且还可以更改图标部分的背景颜色？

我需要什么：http://imgur.com/fRacpMa

所以我猜这不是内置的功能。我如何为自己构建一个CSS？

Answer 1

是的，请参阅文档的Glyphicons部分。 Demo

<div class="panel panel-default">
  <div class="panel-heading">
    <h3 class="panel-title"><span class="glyphicon glyphicon-music"></span> Panel title</h3>
  </div>
  <div class="panel-body">
    Panel content
  </div>
</div>

改变颜色的CSS。

.glyphicon {
    color: #ff0000;
}

Answer 2

为每个寻找类似解决方案的人。

我发现这个引导片段会修改面板行为以使其水平工作：

http://bootsnipp.com/snippets/featured/panel-horizontal