'웹프로그래밍/css'에 해당되는 글 1건

  1. HTML5의 placeholder 속성 사용하기

HTML5의 placeholder 속성 사용하기

placeholder 속성은 한 단어나 짧은 구로 이루어진 ‘힌트’를 나타냅니다. 이러한 힌트는 사용자가 입력 상자에 데이터를 입력하는데 도움을 줍니다. 보통 아이디나 비밀번호를 입력하는 UI에서 ‘아이디를 입력하세요’나 ‘영어와 숫자로 이루어진 비밀번호를 입력하세요.’와 같은 메시지를 입력 영역의 자리에서 제공하는 경우에 사용됩니다.


다음과 같이 마크업합니다.

<input type="text" name="aaa" placeholder="이름을 입력하세요" />


스타일을 이용해서 placeholder가 세로 중간에 보이게 하려면,

line-height:normal 을 이용하면 된다.

<input type="text" name="aaa" placeholder="이름을 입력하세요"  style="line-height:normal" />


placeholder 속성은 html5에 존재하는 속성으로 Internet Explorer 를 제외한 대부분의 html5를 지원하는 브라우져에서 동작한다.


참고.

http://www.w3schools.com/tags/att_input_placeholder.asp