Тег <kbd>: обозначение пользовательского ввода
Элемент kbd обозначает ввод пользователя: клавишу, сочетание клавиш или другую вводимую команду в учебной инструкции.
Назначение
Элемент kbd обозначает ввод пользователя: клавишу, сочетание клавиш или другую вводимую команду в учебной инструкции.
Как это работает
Для сочетания можно вложить отдельные kbd в общий kbd, сохранив разделители обычным текстом. Вид клавиши задают CSS; сам элемент ничего не перехватывает и не регистрирует клавиатурную комбинацию.
Пример
<style>kbd{font-family:monospace;border:1px solid #9aa;border-radius:4px;padding:2px 5px}</style>
<p>Для сохранения нажмите <kbd>Ctrl</kbd> + <kbd>S</kbd>.</p>Что должно получиться
Названия клавиш выделены как пользовательский ввод. Это текстовая инструкция: нажатие сочетания по-прежнему обрабатывает браузер или редактор, а не тег kbd.
Граница применения и частая ошибка
Не путайте kbd с code: имя функции является кодом, а клавиша, которую должен нажать пользователь, — обозначением ввода. Декоративная рамка без понятного текста также не объясняет действие.
Самостоятельная проверка
Добавьте инструкции для Enter и сочетания Ctrl+S. Затем прочитайте абзац без CSS: порядок действий и названия клавиш должны оставаться понятными.
HTML и CSS можно изменить в песочнице ниже. Она изолирована: JavaScript, внешние ресурсы и отправка форм отключены. Для проверки сетевых запросов, отправки данных или функций браузера используйте отдельную локальную страницу.