◼︎ 오늘 학습한 내용
10. 국내외 사이트 카피캣 (네이버 게임 1편)
1) 네이버 게임 상단 영역
있는지도 몰랐던 네이버 게임 페이지를 카피해보았다.
간만에 애니메이션 효과를 주었다. 색깔 있는 둥근 사각형 영역들에 마우스를 올리면 위쪽으로 20px인가 올라감.
그리고 box-shadow 라는 것을 배웠다. 말 그대로 박스에 그림자처럼 반투명한 검은색을 넣는것이다. 색상이나 투명도, 그림자 위치를 조정할 수 있다.
오늘은 내용이 짧아보이는데도 비교적 시간이 오래걸렸다. 멍청한 오타 실수가 많았기 때문,,, 게임 페이지라 game이라고 쓸 일이 많았는데 자꾸만 이상하게 gaem 이나 gmae 이런식으로 오타를 내서 css가 자꾸 적용이 안되고, 이걸 찾아내느라 시간이 많이 소요됐다.
◼︎ 어려웠던 점 & 해결방법
우측 상단에 '응모 티켓 받고 꿀템 도전!'이라고 적힌 부분에 대해 강의에서 width: 165px을 주셨는데, 내 피씨 상에서 자꾸 한 글자가 밀려서 아래로 내려오는 문제가 발생했다. pc 디폴트 폰트가 달라서인듯. 그래서 width를 임의로 166px로 하나 올려주었더니 문제가 해결되었다.
New problems require new solutions!
◼︎ 소감
전에 작업했던 네이버 쇼핑, 웹툰, 뉴스 페이지와 다르게 좀 예쁜 것 같아서 작업하면서 기분이 좋았다. 메인 페이지도 이렇게 예쁘게(깔끔하게) 만들면 좋을텐데. 힘내라 네이버 웹디!
