html&css 12

라디오 인풋을 ios 버튼 스타일로 만들어보자

언제부턴가 많이 사용하는 ios 버튼 스타일이다.체크박스로도 구현이 가능하지만 기능을 보면 'on'또는 'off' 둘 중 하나이기 때문에라디오 버튼이 의미상 더 맞는것 같다 See the Pen Untitled by Yongkyu, Lee (@Yongkyu) on CodePen. 기본 라디오 버튼 모양(O)을 숨기고 라벨을 이용해 제어를 해야하는데,라벨 마저 숨긴 상황에서 구현을 하기위해 switch라는 버튼의 trigger를 따로 만들어줘야 했다(css만으로 UI는 구현가능하지만 이 버튼의 기능 활성을 위해 제이쿼리를 사용)

html&css 2024.06.21

인풋박스 입력시 자동으로 생기는 초기화버튼(X)을 바꿔보자

1. 인풋 박스 타입 설정검색 필드(input type="search")는 텍스트 필드(input type="text")와 기능적으로는 똑같지만브라우저에 의해 다르게 표현될 수 있으며,인풋 타입을 검색 필드로 설정할경우 반드시 name속성을 지정해 주어야 한다.name 속성이 설정되어 있지 않으면 서버로 제출되지 않는다. 2. 구현See the Pen search_form by Yongkyu, Lee (@Yongkyu) on CodePen. 3. 설명인터넷 익스플로어(IE)브라우저에서는 기본적으로 입력시 초기화할 수 있는 버튼(X)이 제공된다.이 버튼은 기능과 모양이 브라우저마다 다르기 때문에 기본적으로 제공되는 버튼을 숨기고새로운 초기화 버튼을 만들어서 넣어주었다. 통합검색창 같이 검색어를 많이 입력..

html&css 2024.06.20