728x90 input 박스를 클릭 했을떄 나오는 테두리 색상 변경하기 input 박스를 클릭 했을떄 나오는 테두리 색상 없애기 '컴퓨터' 카테고리의 다른 글
빠나나라떼
개발 by jostory 2021. 5. 12. input박스 클릭했을 때 테두리 색 변경하기 input박스 클릭했을 때 테두리 없애기 '개발' 카테고리의 다른 글
태그css, input:focus 관련글
댓글0비밀글 이전 1 ··· 103 104 105 106 107 108 109 110 111 ··· 121 다음 웹페이지에서 인풋 태그(input)를 사용 하다보면 사용자가 현재 어떤 input 태그에 데이터를 입력 하고 있는지 표시해주기 위해서 활성화된 input 태그를 강조해주는 하이라이트가 생기게 됩니다. 크롬에서는 보통 하늘색 네모난 박스료 표시해주네요. 그런데 웹페이지를 디자인할 때 이 하이라이트가 강조되어 페이지의 디자인과는 잘 맞지 않는 경우가 있어, 이 하이라이트를 CSS 를 이용해 지워보도록 합시다. outline을 none 으로 설정하기CSS 를 이용하여 하이라이트를 제거하는 방법은 아주 간단합니다. 아래 예제를 보시죠. 아주 쉽죠? 포커스된 input 태그(input:focus)의 outline 을 none 으로 설정 해주는 것입니다. 위 코드는 모든 input 태그의 하이라이트가 제거되지만, id 혹은 class 를 사용하여 특정 input 태그만 선택하는 것 역시 가능 합니다. 끝. Devil FrontHTML CSS Input 태그 테두리 없애보리깅~ (focus, outline)DevilFront 2021. 7. 16. 17:38 오늘 개인 프로젝트를 진행하다가 input 태그의 테두리 부분을 없애는 부분에 대해서 한번 정리해두면 나중에 또 쓸일이 있을것 같아 정리해본당 우선 html css 를 조금 만져봤다면 border 속성을 이용해 웬만한 블록의 테두리들은 다 관리해 줄 수 있다.  이 상태에서 테두리를 없애보릴라믄 border:none 을 해주면 된다링 테두리를 없애는데 벌써 성공해 버렸지만 input 태그에 focus 가 되는 순간 바로 테두리가 생겨버린당 ㄷㄷ.. 요때는 hover 와 마찬가지루 클래스명 뒤에 :focus 를 해준상태의 스타일링을 해주면 되는데 border가 아니라 outline 속성을 이용해주면 되겠다. 그럼 이렇게 테두리를 이쁘게 없애줄수 있겠다. 아주 간단하지만 헷갈릴 수 있어 한번 정리해봤당. |
CSS input:focus 테두리 없애기 - CSS input:focus teduli eobs-aegi
관련 게시물
저작권 © 2024 berikutyang Inc.
