728x90
preserveAspectRatio="none"
preserveAspectRatio="none"의 사용
svg는 기본적으로 비율이 지켜지도록 하는 설정이 돼있음.
- 비율을 깨기 위해 사용
- svg 자체에 속성을 주기
- 많은 속성이 있지만 none 이라는 속성 이용
- 적용해주면 svg 비율이 깨져서 쭉 늘어난 것 확인 가능.
preserveAspectRatio="none"
다른 logo들에게 적용시켜주기
animation-timing-function: ease-in-out;
시작할 땐 서서히 했다가 점점 빨라지고 끝부분에 가서는 서서히 속도가 줄어듦
- 속도와 관련된 그래프이기 때문에 cubic-bezier라는 속성을 이용해서 함수를 따로 설정해 줄 수 있음.
궁금한거 해결할 부분
const links = document.querySelectorAll(".link-tree li"); 질문
console.dir 출력
728x90
'> 콜로소 > [고윤서] 인터랙티브 웹사이트 만들기' 카테고리의 다른 글
[3-1] 날씨 API 웹 포스터 (2) - 폰트, sass 경로, flex (0) | 2024.04.30 |
---|---|
[3-1] 날씨 API 웹 포스터 (1) - Pseudo, 이벤트 (0) | 2024.04.29 |
[2-5] 웹 명함 구축하기 (1) - ul, ol, a태그 , before (0) | 2024.04.29 |
[2-4] 웹 명함 구축하기 (2) - 웹폰트, 변수 지정, sass 기능 (1) | 2024.04.28 |
[2-4] 웹 명함 구축하기 (1) - 기본 설명 정리 (css, sass, js) (0) | 2024.04.27 |