我正在使用以下引导程序图标 class="glyphicon glyphicon-plus" 我想改变按钮的颜色,我使用以下内容 但是现在我想要加号图标就像这样的圆圈,我应该怎么做? i.glyphicon { color: white; } 另一个名
class="glyphicon glyphicon-plus"
我想改变按钮的颜色,我使用以下内容
但是现在我想要加号图标就像这样的圆圈,我应该怎么做?
i.glyphicon { color: white; }另一个名为 font-awesome的图标包具有更好的灵活性和将图标堆叠在一起的功能.包含Glyphicons的Bootstrap 3没有太多选项,所以我从font-awesome中取出了CSS并将其用于Glyphicon.
HTML看起来像:
<span class="glyphicon-stack"> <i class="glyphicon glyphicon-circle glyphicon-stack-2x"></i> <i class="glyphicon glyphicon-plus glyphicon-stack glyphicon-stack-1x"></i> </span>
主要的CSS:
.glyphicon-stack { position: relative; display: inline-block; width: 2em; height: 2em; line-height: 2em; vertical-align: middle; } .glyphicon-circle{ position: relative; border-radius: 50%; width: 100%; height: auto; padding-top: 100%; background: black; } .glyphicon-stack-1x { line-height: inherit; } .glyphicon-stack-1x, .glyphicon-stack-2x { position: absolute; left: 0; width: 100%; text-align: center; }
对于图标的样式(颜色,大小),您可以创建更多css类属性并添加到相应的图标.
看看这个example.