본문 바로가기

전체 글41

피그마 기초 [피그마] -웹, 앱 둘 다 사용 가능함. 웹 1. 설치없이 웹상에서 브라우저로 사용 가능하다. 2. 폰트 설치 후 사용 불가능한 폰트들도 있다. 앱 1. 설치 후 사용 가능하다. 2. 폰트 적용이 가능하다. (단, 폰트 설치 후 재시작) 3. 브라우저에서 로그아웃해도 풀리지 않는다. 앱 상에서 반드시 로그아웃 진행. [공동작업 or 개인작업] (개인작업 디자인파일) 1. 무제한으로 파일과 페이지를 생성할 수 있다. 2. 공동작업이 불가능하다. (공동작업 디자인파일) 1. 파일 3개 파일 1개당 페이지 3개 제한(무료, 그 이상은 유료 결제) 2. 공동작업도 가능하고 개인작업도 가능하다 [포토샵, 일러스트, 피그마] (포토샵) - 배너 - 포스터 등.. (일러스트) 백터작업 - 일러스트 - 아이콘 - 캐.. 2024. 5. 14.
자바스크립트 연결 cdnjs -> 검색창에 jquery가장 늦게 실행해주자고 이야기 하는 defer까지 입력해주기.자바스크립트에 아래 코드를 작성하여 제대로 연결되었는지 확인하기.(css에서 margin, padding 기본값으로 바꾸기.)margin, padding 부분 gray로 바뀐 것을 보아 스크립트 잘 연결된 것으로 확인. 다시 원래대로 margin:0; padding:0; 하기. menu-icon 클릭 시 클릭이 잘 안됨.이유 : 1. 아이콘 크기가 작음. (tip 코드 구현 시 아이콘을 포함한 박스의 크기를 키우기)이유 : 2. 아이콘 위에 다른 태그가 가려져 있을 수 있음. (아래 사진을 보면 nav-text. tran-05가 font-size: 14px;로 가려짐.)    해결: nav-text{font-.. 2024. 5. 7.
반응형 사이트 재구현 5/6 2024. 5. 6.
반응형 사이트 왠만한 건 자바스크립트 안쓰고 css에서 처리해야 가볍고 빠름. [아이콘 박스 중 두번째꺼 없애기]width: 0; -> 공간 없앰opacity: 0; -> 투명한 상태overflow: hidden; -> 깔끔하게 보이지 않도록[350px이하로 내려가면 mo-nav사라짐(@madia)]여기서 이렇게 되는 코드->media.css@media screen and (max-width:350px){ .mo-section { opacity: 0; visibility: hidden; } .mo-nav ul { height: 0; } /* .menu-icon-box{width: 0; opacity: 1; overflow: visible;} */ .menu-icon-box .menu-icon{fo.. 2024. 5. 2.