Html 如何更改引导程序字形的颜色?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/38979338/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to change color of bootstrap glyphicon?
提问by hussain
I want to change bootstrap glyphicon color to "yellow" because current color is showing in white that looks like Delete button. How can i change color of glyphicon-folder-close
or use any other glyphicon that display folder image better ?
我想将 bootstrap glyphicon 颜色更改为“黄色”,因为当前颜色显示为白色,看起来像“删除”按钮。我如何更改颜色glyphicon-folder-close
或使用任何其他可以更好地显示文件夹图像的字形?
main.html
主文件
<button type="button" class="btn btn-info btn-lg" ng-click="serverFiles()" style="margin-left: 10px"><span class="glyphicon glyphicon-folder-close"></span></button>
采纳答案by scaisEdge
Use color
使用颜色
<button type="button"
class="btn btn-info btn-lg" ng-click="serverFiles()"
style="margin-left: 10px; color:#FF0000;">
<span class="glyphicon glyphicon-folder-close"></span></button>
But remember that it is desirable to avoid the use of inline style is better use classes or references based on external css configuration items
但请记住,最好避免使用内联样式,最好使用基于外部 css 配置项的类或引用
<button type="button"
class="btn btn-info btn-lg mybtn-blue" ng-click="serverFiles()"
style="margin-left: 10px;">
<span class="glyphicon glyphicon-folder-close"></span></button>
edn for external css
用于外部 css 的 edn
.mybtn-blue {
color: blue;
}
回答by Andrew
You can also change the icon/text by adding to the class "text-success" for green, "text-danger" for red etc. This will change the color of the icon itself.
您还可以通过添加绿色的“text-success”类、红色的“text-danger”等来更改图标/文本。这将改变图标本身的颜色。
<span class="glyphicon glyphicon-usd text-success"></span>
Also this has been answered here.
这也在这里得到了回答。
Change the color of glyphicons to blue in some- but not at all places using Bootstrap 2
回答by Gowtham
Use the following HTML code
使用以下 HTML 代码
<button type="button" class="btn btn-info btn-lg" ng-click="serverFiles()" style="margin-left: 10px"><span class="glyphicon glyphicon-folder-close yellow"></span></button>
And the css code
和 css 代码
.yellow {
color: #FFCA28;
}
here is the demo http://jsfiddle.net/S3R23/1217/
回答by Nkosingiphile
You can change color of the icon by directly specifying color name, however this will only apply to targeted icon.
您可以通过直接指定颜色名称来更改图标的颜色,但这仅适用于目标图标。
<a href="#" class="glyphicon glyphicon-exclamation-sign" style="color: red; font-size: 20px"></a>
回答by Derick Alangi
To change the color, do this:
要更改颜色,请执行以下操作:
<span class="glyphicon glyphicon-folder-close" style="color:#ffff00"></span>
Just edit the span tag in your code to the one above, making your code to look like this:
只需将代码中的 span 标记编辑为上面的那个,使您的代码看起来像这样:
<button type="button" class="btn btn-info btn-lg" ng-click="serverFiles()" style="margin-left: 10px"><span class="glyphicon glyphicon-folder-close" style="color:#ffff00"></span></button>
回答by Syed Shibli
You can change glyphicon color to any value. see below given example
您可以将字形颜色更改为任何值。见下面给出的例子
<span aria-hidden="true" class="glyphicon form-control-feedback glyphicon-ok"></span>
//css
//css
.glyphicon.form-control-feedback.glyphicon-ok{
color: #20032d !important;
}