83 votes

Bootstrap 3 Glyphicons CA

ATTENTION!

Le Bootstrap icônes sont de retour après cette demande d'extraction de fusion.


Après un va-et-vient sur ce pour les deux dernières semaines, j'ai décidé de restaurer les Glyphicons icône de la police de la principale repo. Compte tenu de la prévalence de ces icônes sont dans l'Isu, c'est probablement un mauvais service à la plupart des gens de ne pas les inclure (ou d'une autre icône de la police) dans le même endroit que le fichier CSS et JS.

Avec cette mise à jour vient le suivant:

  • Restaure la documentation (sur la page de Composants)
  • De nouvelles variables, @icon-font-path et @icon-font-name, de la flexibilité pour l'ajout et la suppression de l'icône polices
  • Les mises à niveau à la dernière Glyphicons (ajout de 40 nouvelles icônes)
  • Supprime l' ancien Glyphicons mention de la page CSS

Nous allons travailler sur l'amélioration de la personnalisation de l'icône polices dans le futur afin de permutation des bibliothèques de polices peut être plus facile (qui est le tout de la motivation pour l'original de suppression).


Qui est le CDN url de la nouvelle version de Twitter Bootstrap Glyphicons?

À partir du Bootstrap 3 , ils ont été déplacés dans un autre référentiel, mais je n'ai pas trouvé CA.

À partir de la documentation officielle:

Avec le lancement de Bootstrap 3, les icônes ont été déplacés vers un autre référentiel. Cela maintient le projet le plus mince possible, il est plus facile pour les gens à permuter les bibliothèques d'icônes, et rend Glyphicons icône polices plus facilement disponibles pour plus de gens à l'extérieur de Bootstrap.

Sur le site officiel ils ne fournissent pas un CDN url pour les icônes.

Où les trouver? Je ne veux pas de télécharger le référentiel et l'inclure dans mon projet.

159voto

edsioufi Points 3696

Avec la récente version de bootstrap 3, et les glyphicons être fusionné à la Bootstrap repo, Bootstrap CA sert maintenant au complet Bootstrap 3.0 css y compris les Glyphicons. Le Bootstrap css de référence est tout ce que vous devez inclure: Glyphicons et ses dépendances sont sur les chemins d'accès relatifs à la CAN site et sont référencés dans bootstrap.min.css.

Dans le html:

<link href="http://stackoverflow.com//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">

Dans le css:

 @import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css");

Ici, c'est un travail de démonstration.

Notez que vous devez utiliser .glyphicon des classes au lieu de .icon:

Exemple:

<span class="glyphicon glyphicon-heart"></span>

Notez également que vous auriez encore besoin d'inclure bootstrap.min.js pour l'utilisation de Bootstrap composants JavaScript, voir Bootstrap CDN pour les url.


Si vous souhaitez utiliser les Glyphicons séparément, vous pouvez le faire directement par le référencement sur les Glyphicons css sur Bootstrap CDN.

Dans le html:

<link href="http://stackoverflow.com//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">

Dans le css:

@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css");

Depuis l' css le fichier comprend déjà toutes les Glyphicons dépendances (qui sont dans un chemin relatif sur le Bootstrap CDN site), l'ajout de l' css le fichier est tout ce qu'il ya à faire pour commencer à utiliser Glyphicons.

Ici, c'est un travail de démonstration de la Glyphicons sans Bootstrap.

27voto

Ionică Bizău Points 14484

Une alternative serait d'utiliser des Polices-Génial pour les icônes:

Y Compris De La Police Impressionnant

Dans le HTML:

<link href="http://stackoverflow.com//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">

Ou dans le CSS

@import url("//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css");

Utilisation:

<i class="icon-plus"></i>

Il contient beaucoup d'icônes!

3voto

trante Points 3811

Bien que Bootstrap CA restauré glyphicons de bootstrap.min.css, Bootstrap CDN de Bootswatch fichiers css ne comprend pas glyphicons.

Par exemple Amelia thème: http://bootswatch.com/amelia/

Par défaut Amelia a glyphicons dans ce fichier: http://bootswatch.com/amelia/bootstrap.min.css

Mais Bootstrap CDN du fichier css ne comprend pas glyphicons: http://netdna.bootstrapcdn.com/bootswatch/3.0.0/amelia/bootstrap.min.css

Afin @edsioufi mentionné, vous devez inclure, vous devez inclure les glphicons css, si vous utilisez Bootswatch des fichiers à partir du fichier d'amorce CDN. Fichier: http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X