Web Study

KAKAO AI flex box + svg이미지 가져오기 + 2차 메뉴 구성과 정렬 + 메뉴 하단 보더 적용 시 2차 메뉴와 자연스럽게 연결 해주기 + jQuery 기초 점점 줄어들다가 최소 너비에서 줄어들지 않는 적응형으로 구성 2차 메뉴까지 flex box로 정렬 svg이미지 따로 모아주는 작업 하기 소개 서비스 제품 미니링크 미니헥사 헤이카카오 카카오미니 카카오홈 파트너 카카오톡 자동차 내비게이션 스마트악세서리 디스플레이 스마트홈 제휴문의

사용 예시 출처 > '카카오 AI 사이트 logo' 처음 개발자 도구에서 이미지를 가져 왔을 때 클래스명, fill, 제목 등등 사용자가 작성한 모든 것이 담겨 온다 kakaoi 필요한 부분만 수정, 다듬기(대부분의 로고 형태는 사이트에서 링크 되므로 a클래스 안에 넣어주자) 패스 부분 마저 가져오기 path는 svg 클래스 안에 포함되어 있어야 하는데, 패스 길이가 어마어마 하니 작업에 방해가 된다 그렇기 때문에 사용 하는 svg 이미지가 2개 이상 정도 되면 svg 클래스를 만든 후 따로 모아서 빼주는게 좋다 css 설정 html 입력이 끝났는데 이미지가 나오지 않을 때는 색상과 크기를 반드시 지정 해준다 (svg 이미지는 한계 없이 유연) /* 노말라이즈 */ body, ul, li { margin..

www.youtube.com/watch?v=v37JcsRddBs #ButtonHoverEffect #JavascriptAnimation 재밌는 영상이다. 뭔가 코딩에 흥미를 불러 일으켜 주는 그런 영상이라고 할까나..나중에 한번은 써먹겠지(버튼 호버 효과는 유용하니까능!) Button Hover Effect Using Vanilla Javascript 출처 > 유튜브 > by Codegrid

www.youtube.com/watch?v=62VhFzLK8jw #CSS #CSS Animation CSS Animation의 간단한 구현 방법과 활용 출처 > 유튜브 > by ANZI (31강~36강)

brunch.co.kr/@ggk234/11#comment 'SVG'를 사용하는 이유! SVG에 대한 이해와 활용법에 대한 설명 | 왜 요즘 수많은 디자이너들은 SVG 아이콘을 쓰는 것일까? 그 이유는 명확합니다. '안 깨지고' '용량이 적고' '출력이 빠름' '수정과 애니메이션이 가능' 이 brunch.co.kr #svg #ui #아이콘 #에니메이션 #svg vs png '안 깨지고' '용량이 적고' '출력이 빠름' '수정과 애니메이션이 가능' (출처 브런치 > by 디자이너 giii)