분류 전체보기57 제이쿼리로 스르륵 열리는 아코디언 메뉴 만들기 (자주하는 질문, FAQ) 1. 소스 [HTML] Q 질문01? A 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 Q 질문02? A 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 Q 질문03? A 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 Q 질문04? A 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 Q 질문05? A 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 내용 [CSS] [JS] 2. 결과 화면 See the Pen Untitled by H__jung (@honghongbyu.. 2022. 8. 25. 제이쿼리로 탭메뉴, 탭버튼 만들기 1. 소스 [HTML] 01탭 버튼 02탭 버튼 03탭 버튼 04탭 버튼 내용01 내용01 내용01 내용01 내용01 내용01 내용02 내용02 내용02 내용02 내용02 내용02 내용03 내용03 내용03 내용03 내용03 내용03 내용04 내용04 내용04 내용04 내용04 내용04 [CSS] [JS] 2. 결과 화면 See the Pen Untitled by H__jung (@honghongbyul) on CodePen. 3. 제이쿼리 문법 정리 .attr() : 선택한 요소의 속성값을 가져온다. .find() : 특정 요소를 찾는다. .addClass() : 선택한 요소에 클래스 값을 추가한다. .removeClass() : 선택한 요소에서 클래스 값을 제거한다. .siblings() : 선택한 .. 2022. 8. 24. 디자인 참고에 좋은 컬러 조합 사이트 * 사이트명을 클릭하면 해당 페이지로 이동합니다. 1. 컬러스페이스(ColorSpace) 컬러스페이스(ColorSpace)는 자신이 원하는 색과 어울리는 컬러 조합을 추천해주는 사이트이다. 화면 중앙에 컬러 코드가 적혀 있는 버튼을 눌러 원하는 색을 선택하고 바로 밑에 GENERATE 버튼을 누르면 선택 색상과 어울리는 컬러 조합을 확인할 수 있다. 2. 브랜드컬러(BrandColors) 브랜드컬러(BrandColors) 는 세계 유명 브랜드의 컬러 정보를 모아둔 사이트로 원하는 컬러를 클릭하면 해당 컬러 코드가 복사되어 쉽게 컬러 정보를 얻을 수 있다. 3. 컬러 헌트(Color Hunt) 컬러 헌트(Color Hunt)는 다양한 컬러 조합을 바로 확인 할 수 있는 사이트로 테마별로 나누어져 있어 원하.. 2022. 8. 23. 테이블 1열이 고정된 가로 스크롤 테이블 만들기 (position: sticky) 데이터 양이 증가하면 스크롤 길이가 길어지면서 데이터 구별이 어려워지는데 엑셀에서는 틀 고정을 이용해서 데이터를 쉽게 파악할 수 있다. 그래서 이번에는 CSS의 position: sticky를 사용해 좌우 스크롤을 해도 테이블의 첫 번째 열은 고정되어 있는 테이블을 만들어 보려 한다. 1. position: sticky ? 부모 요소 안에서 위치값을 고정시켜준다. top, bottom, left, right 중에 하나는 필수적으로 꼭 설정해야 한다. IE11이하 버전은 지원하지 않는다. 2. HTML, CSS 소스 [HTML] Header 1 Header 2 Header 3 Header 4 Header 5 Header 6 Header 7 Header 8 Cell01 Cell02 Cell03 Cell04 .. 2022. 8. 23. 이전 1 ··· 9 10 11 12 13 14 15 다음
