web-dev-qa-db-fra.com

Comment utiliser Bootstrap Glyphicons dans 3.0.0?

J'utilise des glyphiques dans Bootstrap. J'appelais le CSS directement depuis http://glyphicons.getbootstrap.com/css/bootstrap-glyphicons.css mais cela a maintenant disparu et n'était pas recommandé.

Cela coïncide apparemment avec Twitter qui rend les glyphiques disponibles dans le package Bootstrap. J'utilise à nouveau Bootstrap 3.0.0 RC1 ou RC2).

Mon problème: je n'ai aucune idée de comment utiliser les icônes dans mon propre hébergement ... Il me semble que le code est contenu dans le bootstrap.css (?). J'ai téléchargé le répertoire "fonts", mais je ne reçois que des icônes vides dans des cases vides où il devrait y avoir des icônes appropriées.

Des idées s'il vous plait? Quel devrait être où et comment devrait-il être appelé?

twitter-bootstrapiconsglyphicons
18
Robert Andrews

Le bootstrap-glyphicons.css le fichier semble avoir été supprimé avec la version\production Bootstrap 3.0.0. Téléchargez simplement le Zip depuis http://getbootstrap.com/ puis copiez les dist/css/bootstrap.min.css fichier dans votre dossier css. Vous devez ensuite l'inclure dans votre page HTML en tant que telle:

<!DOCTYPE html>
<html>
  <head>
    <title>Bootstrap 101 Glyphicons</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Bootstrap CSS file -->
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">

  </head>
  <body>

    <!-- Glyphicon in a H1 tag -->
    <h1>Hello, <span class="glyphicon glyphicon-globe"></span> !</h1>

  </body>
</html>

Source: http://getbootstrap.com/getting-started/

10
David Lemayian

Si vous avez déjà mis dans le répertoire des polices, appeler les icônes maintenant serait <span class="glyphicon glyphicon-pencil"></span> au lieu de <i class="icon-large icon-pencil"></i>.

7
mrkre

Assurez-vous simplement que votre dossier de polices est correctement placé par rapport au fichier .css: ../fonts

some-root-folder
├--my-css-folder
|  └--bootstrap.min.css
└--fonts
   └--glyphicons-halflings-regular.ttf
3
user3807820

J'ai suivi ce post http://www.erikminkel.com/2013/09/01/Twitter-bootstrap-3-in-a-Rails-4-application . Je ne sais pas si c'est la meilleure façon, mais ça marche.

2
Nelson Patricio Jimenez