select 검색 결과
2 개의 검색 결과가 있습니다.
Javascript

div태그로 custom select 만들기

HTML5 select 태그의 styling 한계 HTML5 select 태그는 form에서 자주 쓰이는 input user interface로 여러 옵션을 주고, 그중 선택할 수 있도록 하는 UI입니다. select의 선택지는 option태그로 만들어주는데 이 option 태그가 CSS로 스타일링하는 데에 많은 한계를 가진다는 아쉬움이 있습니다. 다음은 select와 option태그로 간단한 스타일링을 한 예시입니다. See the Pen Untitled by cocoder16 (@cocoder16) on CodePen. option 각 블록은 height이나 padding 값이 적용되지 않고 mouseover상태에 대해서도 css로 스타일링을 할 수 없습니다. div 태그를 이용하여 select를 구..

2022. 2. 14. 08:00
HTML

[웹개발 HTML] 사용자가 입력할 수 있는 UI 만들기

사용자가 웹페이지에서 '입력' 행위를 할 수 있는 인터페이스를 제공하는 HTML 태그들 웹페이지에서 사용자가 '입력'을 할 수 있는 인터페이스란 어떤 것들을 말하는 것일까요? 예를 들어 검색엔진을 한번 생각해보도록 합시다. 검색엔진에는 검색어를 입력할 수 있는 검색창이 있습니다. 이것은 사용자가 텍스트를 입력할 수 있는 인터페이스입니다. 또 다른 예시를 찾아볼까요. 웹사이트에서 제공하는 기능들을 제대로 이용하기 위해서는 로그인이 필요한 경우가 있습니다. 로그인을 하기 위해서는 '아이디'와 '비밀번호'를 입력해야겠죠? 그리고 로그인을 하기 위해 '로그인 버튼'을 누릅니다. 이런 입력 공간이나 버튼들이 다 사용자가 어떤 정보(데이터)를 입력할 수 있도록 해주는 사용자 인터페이스(UI)입니다. 이런 UI를 제..

2021. 1. 18. 08:00