반응형
인풋에 포커스 되었을 때 플레이스 홀더가 바로 사라지게 하려면 아래와 같이 CSS를 작성해줍니다.
/* lastest version */
input::placeholder { /* Chrome, Safari, Firefox */
color: #222;
opacity: 1;
}
input:-ms-input-placeholder { /* IE, Edge */
color: #222;
opacity: 1;
}
/* old version */
input:focus::-webkit-input-placeholder {
color: transparent;
}
input:focus::-moz-placeholder {
color: transparent;
}
input:focus:-ms-input-placeholder {
color: transparent;
}
input:focus::-ms-input-placeholder {
color: transparent;
}
See the Pen [CSS Tip] input & placeholder by zinee (@zineeworld) on CodePen.
반응형
'개발일지 > CSS' 카테고리의 다른 글
[CSS] Gradient Border (4) | 2017.01.13 |
---|---|
[CSS] text hover effect (0) | 2016.12.22 |
[CSS] border-radius 원리 (0) | 2016.12.01 |
[CSS] 특정 위치에서 가로폭에 상관없이 중앙 정렬하기 (0) | 2016.11.25 |
[CSS] Country dropdown with flag (0) | 2016.11.23 |