font-awesome Tutorial
Iniziare con font-fantastico

Osservazioni

Impostare

Diversi approcci possono essere utilizzati per integrare FontAwesome in un sito Web:

Per semplice HTML / CSS:

• Scarica lo zip disponibile qui , decomprimi e copia i contenuti sul tuo sito web. Quindi fare riferimento alla /css/font-awesome.css nella pagina web head in questo modo:
  
  <link rel="stylesheet" src="/assets/font-awesome/css/font-awesome.css">
• Riferiscilo nella head della pagina web usando un indirizzo CDN. Uno di questi indirizzi sarebbe https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css . Per fare riferimento a questo, basta usare un tag link ma invece impostare l'origine sull'indirizzo CDN

Per i gestori di pacchetti:

La maggior parte dei gestori di pacchetti supporta Font Awesome come pacchetto, e ci sono alcuni esempi qui sotto:

• NuGet: basta cercare e installare Font-Awesome , oppure eseguire il comando seguente nella console del pacchetto: Install-Package FontAwesome
• Ruby: basta eseguire questo comando: gem install font-awesome-rails
• npm: basta eseguire questo comando: npm install font-awesome

Esempio di base: utilizzo di un'icona

Il caso d'uso semplice è di riferirsi a una singola icona nelle sue dimensioni normali: <i class="fa fa-camera-retro"></i> (Visualizza il risultato in questo violino.)

Crea un tag vuoto (si consiglia di usare <i> usato per quello) e assegna la classe " fa " e la classe corrispondente all'icona desiderata (vedi l'elenco delle icone qui ).

Uso di Font Awesome

Font Awesome è una libreria estremamente semplice ma potente da usare, con 634 icone disponibili in poche parole.

Come funziona? Font Awesome utilizza caratteri Unicode memorizzati in una directory ../fonts per modificare qualsiasi elemento i.fa sul rispettivo carattere unicode, in quanto tale visualizza l'icona come testo.

Come creo un'icona? Tutte le classi di icone devono essere un elemento i , o un italic element , principalmente per le migliori pratiche, ma migliora anche le prestazioni con Font Awesome. Tutte le icone hanno anche la classe fa su di loro. Questo denota un'icona e non funzionerà senza di essa . Dopodiché, aggiungi l'icona che desideri, preceduta da un altro fa- . Un esempio finito è qui sotto:

<i class="fa fa-pencil"></i> diventa

Dato che font awesome opera su caratteri unicode, consente anche a qualsiasi manipolazione del testo di applicarsi anche ad esso, come font-size , color e altro.