2013-03-09 3 views
10

Sto cercando di applicare una regola orizzontale ai CSS. Ho fatto questo finora:Aggiungi carattere Icona fantastica dopo <hr> utilizzando i CSS

http://tinkerbin.com/vdzgAZ9q

Tuttavia, voglio utilizzare il 'icona di stelle' dal Font Awesome al posto del simbolo §.

Qualcuno potrebbe dirmi come si farebbe?

Grazie!

+1

basta creare una '@font -face' in CSS e imposta 'Font-Family' su' hr'. – Bart

+0

Utilizzare invece il violino JS. E cosa hai provato? Font Awesome ha tutte le istruzioni che ti servono per usare il loro font. – Terry

risposta

15

Il primo passo è scaricare i font da fortawesome
Seconda includerli per css. Fate attenzione con i percorsi dei file di font:

@font-face { 
    font-family: 'FontAwesome'; 
    src: url('../font/fontawesome-webfont.eot?v=3.0.1'); 
    src: url('../font/fontawesome-webfont.eot?#iefix&v=3.0.1') format('embedded-opentype'), 
    url('../font/fontawesome-webfont.woff?v=3.0.1') format('woff'), 
    url('../font/fontawesome-webfont.ttf?v=3.0.1') format('truetype'); 
    font-weight: normal; 
    font-style: normal; 
} 

e infine, sostituire regola di contenuto per hr selectior da "§" a "\ F005"

hr:after { content: "\f005";} 
+0

+1 per il valore del contenuto :) – Rahul

+1

@Rahul Tutti possono essere trovati dopo la linea 274 nel 'font-awesome.css' – ErDmKo

+0

Grazie mille! Sono stato perplesso sulla parte "\ f005". –

Problemi correlati