[Project] 17일차 | 내가 본 뮤지컬 웹페이지 만들기

2번째로 만들어본 뮤지컬 웹페이지.

첫번째는 강사님이 만들어주신 틀 안에서 내용만 추가된거여서 따로 올리지는 않았다.

 

이번에는 본문 영역에 sementic tag인 section과 article 태그를 사용해 영역을 구분해주었다.

아직은 header에 페이지를 링크해두지 않았지만 어떤 내용으로 추가 페이지를 구성할지 결정되면 추가로 채워나갈 예정이다.

 

결과물

각 article마다 hover로 애니메이션같은 효과를 넣어주었고, 아직까지 내가 본 뮤지컬이 3개밖에 없어서 남은 영역들은 내가 좋아하는 넘버와 공연했던 넘버로 채워보았다. audio 파일도 넣어둬서 원한다면 넘버를 들어볼 수도 있다.

 

가사는 iframe을 활용해 페이지 안에서 볼 수 있게 구현했는데 더 효율적인 방법이 있을지 찾아봐야겠다.

반응형웹을 구현하느라 article에 일부 여백이 보이는데 이것도 해결방법을 좀 찾아봐야 될 듯 하다.

701px ~ 1000px / ~ 700px