Bootstrap 4 - La etiqueta kbd
Utilizando la etiqueta <kbd></kbd> puedes modificar los estilos de entradas para teclado. Bootstrap 4 nos brinda un magnífico diseño.
<body> <p>Utiliza <kbd>ctrl + c</kbd> para copiar y <kbd>ctrl + v</kbd> para pegar.</p> </body>
Este es el estilo básico, pero con los colores de fondo de Bootstrap podemos añadir más colores:
<kbd>Sin clase</kbd> <kbd class="bg-danger">Danger</kbd> <kbd class="bg-dark">Dark</kbd> <kbd class="bg-info">Info</kbd> <kbd class="bg-light" style="color: black">Light</kbd> <kbd class="bg-primary">Primary</kbd> <kbd class="bg-secondary">Secondary</kbd> <kbd class="bg-success">Success</kbd> <kbd class="bg-transparent">Transparent</kbd> <kbd class="bg-warning">Warning</kbd> <kbd class="bg-white" style="color: black">White</kbd>
Resultado
Puedes añadir más estilos como por ejemplo bordes:
<kbd class="bg-danger" style="border: medium">Danger</kbd> <kbd class="bg-dark" style="border: thick">Dark</kbd> <kbd class="bg-info" style="border: dotted">Info</kbd> <kbd class="bg-primary" style="border: double">Primary</kbd> <kbd class="bg-secondary" style="border: solid">Secondary</kbd> <kbd class="bg-success" style="border: dashed">Success</kbd> <kbd class="bg-transparent" style="border: groove">Transparent</kbd> <kbd class="bg-warning" style="border: inset">Warning</kbd>
Resultado
