recherche

Maison >interface Web >tutoriel HTML >Comment utiliser la balise en HTML pour le formatage des entrées au clavier ?

Comment utiliser la balise en HTML pour le formatage des entrées au clavier ?

PHPz
PHPzavant
2023-08-20 11:45:381302parcourir

Comment utiliser la balise <kbd> en HTML pour le formatage des entrées au clavier ?

Nous utilisons la balise pour définir la saisie au clavier. Il s'agit d'une balise de phrase utilisée pour identifier le texte qui représente la saisie au clavier de l'utilisateur. Le contenu à l'intérieur est affiché dans la police monospace par défaut par la plupart des navigateurs. la police à l'aide d'une feuille de style.

Syntaxe

<kbd> Keyboard text…

Exemple 1

Voici l'exemple utilisant la balise 

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <meta name="description" content="meta tag in the web document">
   <meta name="keywords" content="HTML,CSS">
   <meta name="author" content="lokesh">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
   <p>
      Open a new file using the keyboard shortcut 
      <kbd>Ctrl</kbd> + <kbd>N</kbd>
   </p>
   <p>Press<kbd>Ctrl </kbd> + <kdb>C </kdb>to copy text from the file.</p>
   <p>Press<kbd>Ctrl </kbd> + <kdb>P </kdb>to paste text to the file.</p>
</body>
</html>
La traduction chinoise de

Exemple 2

est :

Exemple 2

Cette balise peut être utilisée dans les documents HTML comme indiqué ci-dessous −

<html>
   <body>
      <p>Two special keys in keyboard are:<kbd>ctrl</kbd>, <kbd>alt</kbd>.</p>
   </body>
</html>

Exemple 3

Nous pouvons également ajouter des styles pour les valeurs du clavier dans les documents HTML. 

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <meta name="description" content="meta tag in the web document">
   <meta name="keywords" content="HTML,CSS">
   <meta name="author" content="lokesh">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <style>
      kbd {
         border-radius: 2px;
         padding: 2px;
         border: 1px solid black;
      }
   </style>
</head>
<body>
   <p>
      Open a new file using the keyboard shortcut
      <kbd>Ctrl</kbd> + <kbd>N</kbd>
   </p>
   <p>Press<kbd>Ctrl </kbd> + <kdb>C </kdb>to copy text from the file.</p>
   <p>Press<kbd>Ctrl </kbd> + <kdb>P </kdb>to paste text to the file.</p>
</body>
</html>

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：
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer
Article précédent：Comment créer un composant de carte en utilisant Tailwind CSS ?Article suivant：Comment créer un composant de carte en utilisant Tailwind CSS ?

Articles Liés

Voir plus