가상클래스:placeholder-shown

placeholder-shown

placeholder 텍스트가 보이는 상태인지 아닌지를 체크할 수 있는 가상 클래스이다.

Example

Html

<input type=text placeholder="test"  />

CSS

/* placeholder 가 보일때 컬러가 #cbcbcb 로 처리됩니다. */
input[type=text]:placeholder-shown {
	color: #cbcbcb;
}

/* placeholder 가 보이지 않을 때, 즉 사용자가 입력할때 color가 #000 으로 설정 */
input[type=text] {
	color: #000
}