네이버 게임 페이지를 도면작업하는 실습을 했다 css 디자인 작업이 html 도면 작업보다 더 어렵다고 생각했었는데 요즘엔 css보다 html 도면 작업이 좀 더 헷갈린다. 물론 막상 해보면 금방 하긴한다
비슷한 내용중에 네이버 게임에서는 그림자를 사용했다
이처럼 그림자 같은 경우는 box-shadow; 를 사용하는데 이미지에는 네이버에 사용한 수치를 복사해서 붙혔다 카피하는 작업이 아닌 새로운 웹페이지를 도면작업 해야할시 필요한 사이트이다
https://cssgenerator.org/box-shadow-css-generator.html
그리고 html 도면작업을 먼저 하고나서 css 디자인 작업을 실시 하는데 요즘 강사님께서는 도면작업이 끝난후엔 각각의 클래스의 left, center, right로 설정을 해주고 left 디자인 작업을 할땐 미리 css에 여러 클래스명을 순서대로 나열시켜 작성 후 속성값을 넣어준다 그 후엔 center - right 순으로 작업을 하다보니 보기도 편하고 어디쪽을 작업하는지 확실하게 알기 때문에 매우 괜찮은 디자인작업시 꿀팁 인것 같다
그리고 적용 시킨 애니메이션 부분에서 자연스럽게 움직이게 하기 위해
이처럼 transition: top linear 0.45s; 를 사용 하여 위로 올라갈때 이전처럼 뚝뚝 올라가는게 아닌 자연스럽게 0.45초를 거쳐 올라가다보니 자연스럽게 올라갈 때 사용된다
강의를 들으면 들을 수록 새로운 내용 처럼 들리기도 하지만 분명히 배웠었던 내용이고 다시 한번 들었을땐 절대 잊지 않도록 하겠습니다
날이 더워진 만큼 시원한 바다도 가고싶고 계곡도 가고 싶지만 코로나도 코로나고 html css 도면작업을 끝냈을때의 그 쾌감은 계곡 속에서 팔뚝만한 송어를 잡은 쾌감보다 짜릿하고 크나큰 파도를 즐기며 서핑을 타는 시원함보다 훨씬 시원하다 이정도면 병인거 같다.. 그정도로 지금 듣고있는 강의의 만족도가 200%이다 하루빨리 나만의 사이트를 만들 수 있는 시간이 있음 좋겠다. 물론 그때 당시엔 멘붕이 많이 있겠지만 포기는 하지 않을 자신이 있다
그래도 정말 좋은 강의 해주시는 김인권 강사님
항상 말씀에서 따뜻함과 친절함이 느껴지는 대구 AI 스쿨 관리자분들께
감사합니다 항상 건강하시고 행복하셨으면 좋겠습니다