학습내용
오늘은 애니메이션 패키지 파일에 대해 학습했다.
이 사이트에서 css애니메이션 라이브러리를 둘러보았다.
활용하기 위해서는
head태그 안에 link태그를 복사 붙여넣기 해서 연동을 시켜줘야한다.
그런 다음 하고자 하는 애니메이션 코드를 복사 붙여넣기 하여 실행시켜주면 된다.
혹은 지금까지 해왔던 방식과는 반대로
css에 먼저 클래스를 만들어 놓고 html에 만들어 놓은 css를 삽입하는 방식으로 애니메이션 css를 사용할 수 있다. (라이브러리에서 복사 붙여넣기)
<div class="animate__animated animate__bounce animate__fadeIn color-red">Example</div>animate__animated : class
animate __ bounce,
animate ____ faedIn : 애니메이션 라이브러리
이 사이트에서도 animation을 검색하여 복사 붙여넣기를 할 수 있다.
어려웠던 부분
오늘은 수업이 20분짜리라 딱히 어려웠던 부분이 없었다. 굳이 말하자면 어제 코드들을 깃허브에 올리면서 파일명을 다 바꿔서 올렸는데 오늘 다시 그 파일을 실행을 하니 아무리 해도 css 적용이 안되어서 10분넘게 해결하다가 파일명이 바뀌어서 html과 css 연동도 깨져있단 사실을 알게되어서 수정해주었더니 해결됐다 ㅎ참나.. 그런것도 모르고 질문 남겼으면 얼마나 똥멍충이같았을까 ^^
해결방법
html과 css 파일은 이름이 바뀌어도 꼭!!!! 연동시키는 걸로 해결봤다
학습소감
어제 2시간 반정도 분량의 수업이여서 그런지 멘탈이 탈탈 털렸는데 오늘은 20분밖에 안되어서 좋으면서도 하..복습할게 산더미구나 싶어서 또 동공에 힘이 풀린다.
항상 걱정을 앞서가서 하는 스타일인데 이제 좀 안그래야겠다. 열심히 하다보면 언젠가 길이 보이겠지..!
