placeholder 텍스트 스타일 css 설정 방법

1. 다음 코드로placeholder의 문자 스타일을 제어할 수 있습니다.
::-webkit-input-placeholder { /* Webkit browsers*/
    color: red;
}

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: red;
}

:-moz-placeholder { /* Mozilla Firefox 19+ */
    color: red;
}

:-ms-input-placeholder { /* Internet Explorer 10+ */ 
    color: red;
}

2. 특정한 종류의 라벨을 구체적으로 제어하려면: 앞에 서명을 붙일 때 빈칸이 있어서는 안 된다.
input::-webkit-input-placeholder {
    color: red;
} 

3. 클래스 이름, ID 이름으로 제어하려면: 앞에 클래스 이름, ID 이름을 붙일 때 공백이 있어야 한다.
.test ::-webkit-input-placeholder {
    color: red;
}
#test ::-webkit-input-placeholder {
    color: red;
}

4. 여러 개의 선택기를 동시에 설정할 수 있다
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: red;
}

좋은 웹페이지 즐겨찾기