我可以仅使用 CSS 为引导程序图标添加颜色吗? [英] Can I add color to bootstrap icons only using CSS?
问题描述
使用 Bootstrap！图标略有不同，但还有更多，它们在任何尺寸下看起来都很棒，并且您可以更改它们的颜色.
基本上图标是字体，您可以仅使用 CSS color 属性更改它们的颜色.集成说明位于页面底部提供的链接中.
<小时>Bootstrap 3.0.0 图标现在是字体！
正如其他一些人在 Bootstrap 3.0.0 发布时也提到的，默认的图标字形 现在是 Font Awesome 之类的字体，并且可以通过更改 color CSS 属性来简单地更改颜色.可以通过 font-size 属性更改大小.
Twitter's bootstrap uses Icons by Glyphicons. They are "available in dark gray and white" by default:
Is it possible to use some CSS trickery to change the colors of the icons? I was hoping for some other css3 brilliance that would prevent having to have an icon image set for each color.
I know you can change the background color of the enclosing (<i>) element, but I'm talking about the icon foreground color. I guess it would be possible to inverse the transparency on the icon image and then set the background color.
So, can I add color to bootstrap icons only using CSS?
Yes, if you use Font Awesome with Bootstrap! The icons are slightly different, but there are more of them, they look great at any size, and you can change the colors of them.
Basically the icons are fonts and you can change the color of them just with the CSS color property. Integration instructions are at the bottom of the page in the provided link.
Edit: Bootstrap 3.0.0 icons are now fonts!
As some other people have also mentioned with the release of Bootstrap 3.0.0, the default icon glyphs are now fonts like Font Awesome, and the color can be changed simply by changing the color CSS property. Changing the size can be done via font-size property.
这篇关于我可以仅使用 CSS 为引导程序图标添加颜色吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
