CSS raccourcis clavier
Snippets - 05/08/2015
Cette bibliothèque CSS va vous aider à afficher des raccourcis clavier. Elle est légère et très rapide à exécuter.
Démonstration
Ctrl + Alt + Suppr
Code associé
<kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>Suppr</kbd>
Intégrer la bibliothèque à votre site
L'utilisation de la bibliothèque a été simplifié au maximum. Il vous suffit d'intégrer la bibliothèque sur votre site.
Solution 1 : Facile et rapide, ajouter simplement le lien vers notre CDN
<link rel="stylesheet" href="https://cdn.online-free-tools.com/css/oft-kbd.min.css" type="text/css" />
Solution 2 : Télécharger la bibliothèque et l'appeler sur votre site
Il vous suffit d'ajouter cette ligne et de paramétrer le chemin d'accès au fichier css. Il est préférable de l'ajouter après les appels à d'autres fichier CSS. Cela évitera que les paramètres soient écrasés.
<link rel="stylesheet" href="/css/oft_kbd.min.css" type="text/css" />
Changer la taille d'affichage des touches
Il est possible de changer la taille des touches en appliquant les class kbd-sd, kbd-md et kbd-lg.
| Ctrl | |
| Ctrl | |
| Ctrl | |
| Ctrl | |
Utiliser une autre police de caractère
Si vous souhaitez utiliser une police de caractère (font) particulière sur les balise, il vous suffit placer ce code CSS après l'appel à la bibliothèque (ou directement à la fin du fichier CSS) :
Si vous souhaitez utiliser une police de caractère (font) particulière sur les balise, il vous suffit placer ce code CSS après l'appel à la bibliothèque (ou directement à la fin du fichier CSS) :
kbd{
font-family: 'Inconsolata', monospace;
}
<link href='https://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
Pierrick CUSSET
Autodidacte passionné par le web, je suis toujours à la recherche de nouveaux challenges.
Fondateur de Online-Free-Tools.com.
Commentaires
Pas de commentaire
FR
EN