브라우저별 PlaceHolder Style

placeholder에 Style적용하기

/* - Chrome ≤56,    - Safari 5-10.0           - Samsung Internet ≤6.2
   - Opera 15-43    - Opera Mobile 12-12.1    - Android Browser 2.1-4.4.4
   - QQ Browser     - iOS Safari 4.2-10.2   
*/
::-webkit-input-placeholder {color: #71B1DD;}

/* Firefox 4-18 */
:-moz-placeholder {color: #71B1DD;}

/* Firefox 19-50 */
::-moz-placeholder {color: #71B1DD;}

/* - Internet Explorer 10–11     - Internet Explorer Mobile 10-11 */
:-ms-input-placeholder {color: #71B1DD !important;}

/* Edge (also supports ::-webkit-input-placeholder) */
::-ms-input-placeholder {color: #71B1DD;}

/* CSS Pseudo-Elements Level 4 Editor's Draft
   - Browsers not mentioned in vendor prefixes
   - Browser of newer versions than mentioned in vendor prefixes */
::placeholder {color: #71B1DD;}


#input_text::-webkit-input-placeholder {  color:#E17009;}
#input_text::-moz-placeholder {  color:#E17009; }
#input_text:-ms-input-placeholder { color:#E17009; }
#input_text:-moz-placeholder {  color:#E17009;}
#input_text:placeholder-shown {  border: 2px solid #E17009;}  /* inputbox내의 border 색상 */
#input_text{caret-color: #E17009;}

<input type="text" style="caret-color: #71B1DD;" placeholder="상품코드 혹은 상품명 " />
<br/><br/>
<input type="text" name="input_text" id="input_text" placeholder="텍스트를 입력하세요.">