Html kbd

Postado: 25 de junho de 2022

Html kbd

Neste artigo HTML veremos como usar o elemento HTML chamado de tag <kbd>

A tag HTML <kbd> define o texto como entrada do usuário de um teclado, como as teclas (Enter) ou (Ctrl) Os navegadores tradicionalmente renderizam o texto encontrado na tag <kbd> na fonte monoespaçada padrão.

Veja o exemplo no código abaixo.

Defina algum texto como entrada de teclado em um documento:

<p>Pressione <kbd>Enter</kbd> para continuar...</p>
<p>Pressione <kbd>Ctrl</kbd>+<kbd>C</kbd> para copiar o texto.</p>

Definição e uso da da tag Html kbd

A tag <kbd> é usada para definir a entrada do teclado. O conteúdo interno é exibido na fonte monoespaçada padrão do navegador.

Dica: esta tag não está obsoleta. No entanto, é possível obter um efeito mais, usando CSS

veja o exemplo abaixo.

<html>
<head>
<style>
kbd {
  border-radius: 4px;
  padding: 3px;
  border: 1px solid 000000;
}
</style>
</head>
<body>

<p>Pressione <kbd>Enter</kbd> para continuar...</p>
<p>Pressione <kbd>Ctrl</kbd>+<kbd>C</kbd> para copiar o texto.</p>

</body>
</html>

Configurações padrão de CSS da tag html kbd

A maioria dos navegadores exibirá o elemento html <kbd> com os seguintes valores padrão:

kbd {
  font-family: monospace;
}

Veja também Lista de todas as tags html de frase: 
 

  • <em> : É usado para enfatizar o texto.
  • <strong> : É usado para definir um texto importante.
  • <code> : Inclui o código do computador.
  • <samp> : Define um texto de saída de amostra de um programa de computador.
  • <kbd> : Define o texto de entrada do teclado.
  • <var> : Define o texto da variável.

Publicado por: loopnerd

50 Visualizações

Deixe um comentário

O seu endereço de e-mail não será publicado.

Artigos Relacionados