html/css 독학하기

코스 전체목록

닫기

kbd

설명

The HTML Keyboard Input Element (<kbd>) produces an inline element displayed in the browser's default monotype font. This element is used to identify user input.

키보드(keyboard) 인풋 엘리먼트(키보드 입력 명령어).
인라인 엘리먼트를 브라우저 기본 모노폰트(타자기 폰트 스타일)로 보여준다.
이로써 사용자 인풋을 구별할 수 있다.

Usage Context

Permitted content Flow content or Phrasing content.
Tag omission None, must have both a start tag and an end tag
Permitted parent elements Phrasing content
Normative document HTML 5, section 4.6.14; HTML 4.01, section 9.2.1

속성

이 엘리먼트는 전역속성을 지원한다.

예제

<p>실행 창에서 다음 명령어를 입력하세요.: <kbd>cmd</kbd><br />그리고 '확인'버튼을 클릭하세요.</p>

 

 

A CSS rule can be defined for the kbd selector to override the browser's default font face. Preferences set by the user might take precedence over the specified CSS.

이 속성은 브라우저 기본 폰트 페이스인 타자체로 표현되는데, CSS로 재정의할 수 있다.
사용자 설정이 기본으로 지정된 속성보다 우선한다.

DOM Interface

This element implements the HTMLElement interface.

참고 : up to Gecko 1.9.2 inclusive, Firefox implements the HTMLSpanElement interface for this element.

호환성

Desktop
기능 구글크롬 파이어폭스Gecko) 인터넷 익스플로러 Opera Safari
기본적인 지원          
Mobile
기능 안드로이드 파이어폭스 모바일(Gecko) 인터넷 익스플로러 모바일 오페라 모바일 사파리 모바일
기본적인 지원          

참고

댓글

댓글 본문
  1. engfordev
    설명감사합니다~
    1. 훔.. 실은 설명을 보면서 바로 이해는 못 했어요. 그런데 다시 보니깐, 좀 알 듯도 하네요! CTRL이라고 바로 쓰지 말고, 이 태그 안에 넣어주면, 마치 하나의 키인 것처럼 보여준다는 의미인 거군요~ 특정한 키를 키보드에서 찾아서 치라고 말하고 싶을 때..
    2. 모노타입이 어떤 건지 나중에 찾아보기로 하고 이만 슝~~
    용어사전 탭에 추가해두었습니다. https://docs.google.com/spread...
    대화보기
    • fantalon
      질문 덕분에 저도 공부가 되어 감사합니다^^
      1. 'kbd' 태그의 예를 보면, 'CTRL, ALT, DELETE' 등 키보드 입력어 또는 'www.example.com'처럼 키보드로 쳐야하는 주소 등이 나오더군요. 기본 폰트 표현도 타자타입이라서 이 태그를 사용하면 사용자는 '아, 키보드 입력을 하는 거구나'라고 알 수 있다는 뜻으로 이해했습니다.
      2. 앞에서 언급한것과 같이 kbd 태그는 모노타입으로 표현됩니다. CSS를 kbd에 적용하여 원하는 대로 스타일을 바꿀 수 있다라는 뜻인것 같습니다.
      대화보기
      • engfordev
        잘 해주셨어요 ^^
        Q. 훔.. 그런데 kbd 태그는 어떤 상황에서 쓰는 걸까요? 이건 제가 나중에 생각해보고 싶어서 적어둡니다. :)
        ! 옷.. keyboard에 굵게 칠하신 것,, 센스쟁이신데요??
        Q 사용자의 인풋을 구별한다는 것의 의미는 어떤 걸까요?사용자가 키보드의 어떤 키를 눌렀는지 알 수 있게 된다는 의미일까요?
        이 속성은 브라우저 기본 폰트 페이스인 타자체로 표현되는데, CSS로 재정의할 수 있다.사용자 설정이 기본으로 지정된 속성보다 우선한다.
        Q. 요 부분에서.. 사용자 설정 부분은.. 사용자가 브라우저에서 설정해둔 모양.. 을 의미하는 거겠죠?
        아참, 예제 안에 있는 것도 한국어로 써 주세요. ^^
        피드백을 드리려고 했는데 질문만 더 드리고 도망가네요. ==3
      버전 관리
      graphittie
      현재 버전
      선택 버전
      graphittie 자세히 보기