问题
I am a beginner in web development and I recently started working with Twitter Bootstrap, I know it uses Glyphicons which I already know how to use. But I also came across Font Awesome which says that it is built for Bootstrap.
What are the differences between the two? I mean is one an alternative for the other? Or should you use them in different places?
回答1:
In Bootstrap 2.x.x Glyphyicons were in image format, hence you can't increase the size, change the color, background-color, etc easily. However, font-awesome gives you scalable vector icons that can instantly be customized — size, color, drop-shadow, and anything that can be done with the power of CSS.
Font-awesome is really an alternative for Glyphyicons which is getting updated time-to-time with new icons. Fat and Mdo are planning to integrate Font-awesome in bootstrap version 3 as a replacement for Glyphyicons.
My suggestion is you use bootstrap with font-awesome. First include bootstrap css and then Font-awesome css, so that the Glyphyicons will be override by font-awesome.
UPDATE
In bootstrap version 3.x.x glyphicons become font format, which will render nicely even in 12px font-size. If you're using the latest version of fontawesome, i.e. 4.01, you can use both glyphicons with fontawesome.
回答2:
Font Awesome: - Over 150 more icons - Pixel perfect at default bootstrap font (14px) - Icons do not have the same size and require custom css for each to align - Has bulleted list, rotation (can be added with css3), stacked icons, and spinner animation (can be added manually ) Glyphyicons: - Less Icons - Pixel Perfect at larger font size (16px) - Same size icons
see: http://tagliala.github.io/vectoriconsroundup/
回答3:
Font awesome is a collection of vector icons which are obtained by using a specific font and some css to make the "magic", Glyphicons uses the sprite-css technique.
You can use them both, just add the css file after Bootstrap's one.
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css"/>
If you don't want to have glyphicons but just the font-awesome one you should go here and customize your Bootstrap download to get it without glyphicons.
来源：https://stackoverflow.com/questions/17311231/font-awesome-vs-glyphicons-in-twitter-bootstrap