markdown 字体很棒
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了markdown 字体很棒相关的知识，希望对你有一定的参考价值。
# http://fontawesome.io/get-started/
Font Awesome CDN is the easiest way to get Font Awesome on your website or app,
all with just a single line of code. No downloading or installing!
## Download & Customize
Want to manage and host Font Awesome assets yourself? You can download, customize,
and use the icons and default styling manually.
Both CSS and CSS Preprocessor (Sass and Less) formats are included.
[descargar](http://fontawesome.io/assets/font-awesome-4.7.0.zip)
## Using CSS
1. Copy the entire font-awesome directory into your project.
2. In the <head> of your html, reference the location to your font-awesome.min.css.
`<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">`
## Using Sass or Less
Use this method to customize Font Awesome 4.7.0 using Less or Sass.
1. Copy the font-awesome/ directory into your project.
2. Open your project's font-awesome/less/variables.less or
font-awesome/scss/_variables.scss and edit the @fa-font-path or
$fa-font-path variable to point to your font directory.
`@fa-font-path: "../font";`
_The font path is relative from your compiled CSS directory._
3. Re-compile your Less or Sass if using a static compiler. Otherwise, you should be good to go.
## Need IE7 Support?
If you need IE7 support, you have my condolences.
Really. Font Awesome 4.7.0 doesn't support IE7, but an older version does.
You'll need to check out the 3.2.1 instructions for using IE7 then go complain
to whoever decided your project needs IE7 support.
## Basic Icons
You can place Font Awesome icons just about anywhere using the CSS Prefix fa and the icon's name.
Font Awesome is designed to be used with inline elements
(we like the <i> tag for brevity, but using a <span> is more semantically correct).
`<i class="fa fa-camera-retro"></i> fa-camera-retro`
__Example: basic icon If you change the font-size of the icon's container, the icon gets bigger.__
__Same things goes for color, drop shadow, and anything else that gets inherited using CSS.__
To increase icon sizes relative to their container, use the fa-lg (33% increase),
fa-2x, fa-3x, fa-4x, or fa-5x classes, and If your icons are getting chopped off on top and bottom,
make sure you have sufficient line-height.
``` html
<i class="fa fa-camera-retro fa-lg"></i> fa-lg
<i class="fa fa-camera-retro fa-2x"></i> fa-2x
<i class="fa fa-camera-retro fa-3x"></i> fa-3x
<i class="fa fa-camera-retro fa-4x"></i> fa-4x
<i class="fa fa-camera-retro fa-5x"></i> fa-5x
```
## Fixed Width Icons
Use `fa-fw` to set icons at a fixed width. Great to use when different icon widths throw off alignment.
Especially useful in things like nav lists & list groups.
``` html
<div class="list-group">
<a class="list-group-item" href="#"><i class="fa fa-home fa-fw" aria-hidden="true"></i> Home</a>
<a class="list-group-item" href="#"><i class="fa fa-book fa-fw" aria-hidden="true"></i> Library</a>
<a class="list-group-item" href="#"><i class="fa fa-pencil fa-fw" aria-hidden="true"></i> Applications</a>
<a class="list-group-item" href="#"><i class="fa fa-cog fa-fw" aria-hidden="true"></i> Settings</a>
</div>
```
mas ejemplos en:
### http://fontawesome.io/examples/
以上是关于markdown 字体很棒的主要内容，如果未能解决你的问题，请参考以下文章