Questo sito utilizza cookies, anche di terze parti, per mostrare pubblicità e servizi in linea con il tuo account. Leggi l'informativa sui cookies.
Username: Password: oppure
HTML / CSS - Glyphicon Boostrap
Forum - HTML / CSS - Glyphicon Boostrap

Avatar
tuttodiMC (Normal User)
Expert


Messaggi: 318
Iscritto: 29/10/2012

Segnala al moderatore
Postato alle 17:41
Mercoledì, 28/12/2016
Salve, per un progetto scolastico mi ritrovo a lavorare con bootstrap. Essendo stato ereditato da ragazzi dell'anno scorso, questo progetto ha già un codice da cui posso partire, e ho notato proprio in questo codice il loro utilizzo delle glyphicon di bootstrap. A prima vista sembrava un gioco da ragazzi. Sarebbe bastato inserire nell'attributo class di uno span "glyphicon glyphicon-play" e il simbolo play sarebbe apparso. Tristemente, non è così. Mi ritrovo con uno span vuoto e per l'icona play sono dovuto ricorrere a un codice trovato online su un sito a caso. Dunque, quale può essere il problema? Perché non mi viene visualizzata nessuna glyphicon? Ho inserito nella cartella fonts i 4 file delle glyphicon (.eot, .svg, .woff, .ttf) eppure non funziona. Non sono riuscito a trovare una guida che mi spieghi cosa devo farci con quei file. Inoltre ho anche incluso le librerie  angular necessarie per far funzionare bootstrap. Cosa faccio quindi?

Ultima modifica effettuata da tuttodiMC il 28/12/2016 alle 17:42


Assembly is the way
PM Quote
Avatar
pierotofy (Admin)
Guru^2


Messaggi: 6112
Iscritto: 04/12/2003

Segnala al moderatore
Postato alle 15:17
Giovedì, 29/12/2016
Probabilmente ti mancano le regole @font che vengono incluse con i CSS... http://www.w3schools.com/css/css3_fonts.asp

Angular? Bootstrap non dipende da angular e quindi non ti dovrebbe servire (a meno che il progetto non usa angular).


Seguimi su Twitter: http://www.twitter.com/pierotofy

Fai quello che ti piace, e fallo bene.
PM Quote
Avatar
tuttodiMC (Normal User)
Expert


Messaggi: 318
Iscritto: 29/10/2012

Segnala al moderatore
Postato alle 14:12
Sabato, 31/12/2016
Si il progetto utilizza angular. Mi riferivo in particolare al fatto che ho trovato un file che si chiama ui-bootstrap-tpls-1.2.4.js. Ho provato ad aggiungere le regole @font ma ora visualizza solo un rettangolino con scritto dentro l'esadecimale della glyphicon (e072 per l'icona play). Ho provato allora ad aggiungere la seguente regole, vedendo sul link che mi hai dato tu e in giro per internet:

Codice sorgente - presumibilmente Plain Text

  1. span {
  2.         font-family: glyph;
  3. }
  4.  
  5. .glyphicon-play:before {
  6.         content: "\e072";
  7. }



Ora ho un dubbio. Dato che ho aggiunto la seguente regola @font:
Codice sorgente - presumibilmente Plain Text

  1. @font-face {
  2.     font-family: glyph;
  3.     src: url(font/glyphicons-halflings-regular.woff);
  4. }


potrebbe essere un problema il fatto che il file si trovi nella cartella font? Insomma, queste glyphicon hanno deciso di non mostrarsi a me!


Assembly is the way
PM Quote