HTML input number 화살표를 없어보자!

input number를 쓰면 우측에 숫자를 증가/감소 해주는 화살표가 나온다

 

<input type="number" />

 

디자인적으로 우측 화살표가 이쁘지 않아서 없애고 싶다면 CSS에 아래 코드를 추가하면 된다!

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

 

 

unsplash @sigmund

출처

https://www.w3schools.com/howto/howto_css_hide_arrow_number.asp