[CSS] input border highlight

HTML 인풋박스에 커서가 포커싱되어있을 때 테두리 하이라이트(border highlight) 수정하는 방법.

포커스된 인풋박스 테두리 없애기

<style>

input:focus {
outline: 0px;
}

</style>

포커스된 인풋박스 테두리 수정 (ex : 하늘색 5px)

<style>

input:focus {
outline: 5px solid #80dbff;
}

</style>

아이폰 14.2에서 인풋박스 테두리 하이라이트가 깨지는 현상이 있어서 위와 같이 css를 수정해봤는데 개선 효과가 있다.