Elementos de Entrada de Teclado usando a Tag kbd HTML - Tutorial e Exemplos

Introdução

A tag HTML <kbd> é usada para criar elementos de entrada de teclado para os utilizadores numa página web. Esta tag representa um intervalo de texto inline que denota entrada no formato de texto do teclado, entrada de voz ou qualquer outra entrada de texto pelo teclado.

Neste laboratório, você aprenderá como usar a tag HTML kbd para criar elementos de entrada de teclado em suas páginas web.

Nota: Você pode praticar a codificação em index.html e aprender Como Escrever HTML no Visual Studio Code. Por favor, clique em 'Go Live' no canto inferior direito para executar o serviço web na porta 8080. Em seguida, você pode atualizar a aba Web 8080 para visualizar a página web.

Configurar o arquivo HTML

Crie um novo arquivo HTML chamado index.html e configure a estrutura básica de um documento HTML.

Adicione o seguinte código ao seu arquivo index.html para configurar a estrutura do documento:

<!doctype html>
<html>
  <head>
    <title>Elementos de Entrada de Teclado usando a Tag HTML kbd</title>
  </head>
  <body>
    <!-- Adicione conteúdo aqui -->
  </body>
</html>

Adicionar Elementos de Entrada de Teclado usando a tag

Adicione elementos de entrada de teclado usando a tag <kbd> onde quer que você queira denotar um elemento de entrada de teclado em sua página web.

Adicione o seguinte código dentro da tag <body> para definir um elemento de entrada de teclado com a tag <kbd> para o comando "CTRL + V":

<p>Para colar texto, pressione <kbd>Ctrl</kbd> + <kbd>V</kbd></p>

Agora, adicione o seguinte código dentro da tag <body> para definir um elemento de entrada de teclado com a tag <kbd> para o comando "Shift + Enter":

<p>Para criar uma nova linha, pressione <kbd>Shift</kbd> + <kbd>Enter</kbd></p>

Aninhando a tag `dentro da tag`

Se você deseja especificar que a entrada foi respondida ao usuário pelo sistema, você pode aninhar a tag <kbd> dentro da tag <samp>.

Adicione o seguinte código dentro da tag <body> para aninhar a tag <kbd> dentro da tag <samp> para especificar uma entrada respondida por um sistema:

<p>
  O valor inserido é:<samp><kbd>Enter Value</kbd>:</samp>
</p>

Resumo

Neste laboratório, você aprendeu como usar a tag HTML <kbd> para criar elementos de entrada de teclado em páginas web. Você pode usar esta tag em qualquer lugar que desejar para denotar um elemento de entrada de teclado em sua página web. A tag <kbd> pode ser aninhada dentro da tag <samp> para especificar uma entrada respondida de volta ao usuário por um sistema.

Entrada de Teclado HTML

Introdução

Configurar o arquivo HTML

Adicionar Elementos de Entrada de Teclado usando a tag

Aninhando a tag dentro da tag

Resumo

Aninhando a tag `dentro da tag`