HTML <kbd> 태그

정의와 사용법

<kbd> 태그는 키보드 입력을 정의합니다. 내용은 브라우저 기본 글꼴로 표시됩니다。

ヒント：이 태그는 폐지되지 않았지만, CSS를 사용하여 더 풍부한 효과를 얻을 수 있습니다(아래 예제를 참조하십시오)。

참조하십시오：

태그 설명
<code> 컴퓨터 프로그램의 예제 출력을 정의합니다。
<samp> 키보드 입력을 정의합니다。
<var> 변수를 정의합니다。
<pre> 프리폼atted 텍스트를 정의합니다。

추가로 참조하십시오：

HTML 강의：HTML 텍스트 포맷화

HTML DOM 참조 설명서：Kbd 객체

예제

예제 1

문서에서 키보드 입력으로 사용할 텍스트를 정의합니다：

<p>텍스트를 복사하려면 <kbd>Ctrl</kbd> + <kbd>C</kbd>를 누릅니다. (Windows)</p>
<p>텍스트를 복사하려면 <kbd>Cmd</kbd> + <kbd>C</kbd>를 누릅니다. (Mac OS)</p>

직접 시험해 보세요

예제 2

CSS를 사용하여 <kbd> 요소의 스타일을 설정합니다：

<html>
<head>
<style>
kbd {
  border-radius: 2px;
  padding: 2px;
  border: 1px solid black;
}
</style>
</head>
<body>
<p>텍스트를 복사하려면 <kbd>Ctrl</kbd> + <kbd>C</kbd>를 누릅니다. (Windows)</p>
<p>텍스트를 복사하려면 <kbd>Cmd</kbd> + <kbd>C</kbd>를 누릅니다. (Mac OS)</p>
</body>
</html>

직접 시험해 보세요

전역 속성

<kbd> 라벨은 또한 HTML에서의 전역 속성。

이벤트 속성을 지원합니다

<kbd> 라벨은 또한 HTML에서의 이벤트 속성。

기본 CSS 설정

대부분의 브라우저는 다음 기본 값으로 표시합니다 <kbd> 요소:

kbd {
  font-family: monospace;
}

직접 시험해 보세요

브라우저 지원

크롬 에지 파이어폭스 사파리 오페라
크롬 에지 파이어폭스 사파리 오페라
지원 지원 지원 지원 지원