HTML <input> placeholder 속성

HTML <input> 태그

정의와 사용법

placeholder 이 속성은 입력 필드의 예상 값을 설명하는 짧은 설명을 정의합니다（예：예제 값 또는 예상 형식의 간단한 설명）。

이 설명은 입력 필드가 비어 있을 때 표시되고, 필드가 포커스를 받을 때 사라집니다。

주의：placeholder 이 속성은 다음 입력 유형에 적용됩니다：

  • text
  • 검색
  • URL
  • 전화번호
  • 이메일
  • 비밀번호

实例

包含占位符文本的电话输入字段：

<form action="/action_page.php">
  <label for="phone">전화 번호를 입력하세요：</label><br><br>
  <input type="tel" id="phone" name="phone" placeholder="138-8888-8888"
  pattern="[0-9]{3}-[0-9]{2}-[0-9]{3}"><br><br>
  <small>형식: 138-8888-8888</small><br><br>
  <input type="submit">
</form>

직접 시험해 보세요

문법

<input placeholder="text">

속성 값

값 설명
text 입력 필드 예상 값을 간단히 설명하는 단서를 정의합니다.

브라우저 지원

표에서의 숫자는 이 속성을 최초로 완전히 지원한 브라우저 버전을 나타냅니다.

크롬 에지 파이어폭스 사파리 오페라
크롬 에지 파이어폭스 사파리 오페라
10.0 10.0 4.0 5.0 11.0

주의사항:placeholder 속성은 HTML5에서 새로운 속성입니다.

HTML <input> 태그