[HTML] input 태그의 주요 속성

재규어·2023년 9월 28일

프론트엔드 공부

목록 보기
10/15
post-thumbnail

✨자동으로 입력 커서를 갖다 놓는 autofocus 속성

autofocus 속성을 사용하면 페이지를 불러오자마자 폼에서 원하는 요소에 마우스 포인터를 표시할 수 있다.

  • 기본형
    <input type=텍스트-입력-필드 autofocus required>

✨힌트를 표시해 주는 placeholder 속성

사용자가 텍스트를 입력할 때, 입력란에 적당한 힌트 내용을 표시해서 그 필드를 클릭하면 내용이 사라지도록 만드는 속성


✨읽기 전용 필드를 만들어 주는 readonly 속성

사용자가 입력하지는 못하고 읽게만 하는 읽기 전용 필드.
해당 필드를 읽기 전용으로 바꾼다. 텍스트 필드나 텍스트 영역에 내용이 표시되어 있어도 사용자는 그 내용을 볼 수만 있고, 입력은 할 수 없다.

  • 기본형
<input type="텍스트-입력-필드" readonly>

✨필수 입력 필드를 지정하는 required 속성

반드시 입력해야 하는 내용은 required 속성을 지정해 필수 필드로 만든다.




출처: Do it! HTML+CSS+자바스크립트 웹 표준의 정석 (고경희, 이지스퍼블리싱)
profile
코딩이라는 정글에서 살아남기

0개의 댓글