Input Text 박스 백그라운드 이미지 추가 

1
<input type='text' placeholder='입력하세요' maxLength="6"/>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
input{
  font-size: 16px;
  border: 1px solid #888888;
  height: 56px;
  width: 95%;
  
  /* input 텍스트 인텐트 설정*/
  text-indent: 16px;

  /* input 박스 안의 이미지 설정, 하위 브라우저에서 지원 안함 */
  background: url('/ico_error.png') no-repeat center right 16px;
  background-size: 24px 24px;
  
  /* placeholder css 설정 */  
  ::placeholder {
    color: #bbbbbb;
    opacity: 1; /* Firefox */
  }

  :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #bbbbbb;
  }

  ::-ms-input-placeholder { /* Microsoft Edge */
    color: #bbbbbb;
  }
}

References