Veuillez laisser un espace approprié entre l'icône et le texte."/> Veuillez laisser un espace approprié entre l'icône et le texte.">

Maison >interface Web >Tutoriel d'amorçage >Comment utiliser l'icône de police bootstrap

Comment utiliser l'icône de police bootstrap

(*-*)浩
(*-*)浩original
2019-07-11 13:31:563451parcourir

Bootstrap est livré avec des glyphes dans plus de 200 formats de police. Tout d’abord, comprenons d’abord ce qu’est une icône de police.

Comment utiliser l'icône de police bootstrap

Qu'est-ce qu'une icône de police ? (Apprentissage recommandé : Tutoriel vidéo Bootstrap)

L'icône de police est une police d'icône utilisée dans les projets Web. Bien que Glyphicons Halflings nécessite une licence commerciale, vous pouvez utiliser ces icônes gratuitement via Bootstrap basé sur un projet.

Pour exprimer notre gratitude à l'auteur de l'icône, nous espérons que vous inclurez un lien vers le site GLYPHICONS lors de son utilisation.

Obtenez l'icône de police

Nous avons téléchargé la version Bootstrap 3.x dans le chapitre Installation de l'environnement et compris sa structure de répertoires. Les icônes de police se trouvent dans le dossier des polices, qui contient les fichiers suivants :

glyphicons-halflings-regular.eot

glyphicons-halflings-regular.svg

glyphicons - halflings-regular.ttf

glyphicons-halflings-regular.woff

Les règles CSS pertinentes sont écrites dans bootstrap.css et bootstrap-min.css dans le dossier css du dossier dist sur le déposer.

Il y a 200 classes, chaque classe est pour une icône. Le format commun de ces classes est le suivant :

.glyphicon-keyword:before {
  content: "hexvalue";
 }

Pour utiliser des icônes, utilisez simplement le code suivant. Veuillez laisser un espace approprié entre l'icône et le texte.

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

Pour des articles plus techniques liés à Bootstrap, veuillez visiter la colonne Tutoriel Bootstrap pour apprendre !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn