Vincent Van Gogh page

html과 css, AOS.js 라이브러리를 사용해서 Vincent Van Gogh 소개 페이지를 제작해보았습니다.

파일은 index.html, work.html, more.html 과 css, img 파일을 만들어서 제작하였습니다.

index.html에선 고흐의 주요 작품의 명칭과 제작연도, 일대기를 나누어서 화면에 배치하였습니다.

위 gif는 aos.js를 이용하여 주요 내용들을 애니메이션화 시켜 좀 더 페이지 내용에 집중할 수 있도록 만들었습니다.

CSS

display : flex;
display : inline-block;
a:hover

flex를 자주 사용하여 레이아웃에 elment 배치를 좀 더 다양하게 할 수 있도록 하였습니다.
줄 바꿈이 이루어지지 않도록 inline-block을 사용하였습니다.
또 navigation에 직관적인 애니메이션을 위해 마우스 커서를 hovering 하였을 때 밑줄이 나타나도록 하였습니다.