2021-07-16 개발일지

정서윤·2021년 7월 16일

학습 한 내용

덴마크 쇼핑몰을 만드는 실습을 했다. 일단 최근까지 만들어봤던 키즈가오와 다른점은 키즈가오는 @media () 부분에 모바일 버전을 작업을 했지만 덴마크 쇼핑몰은 @media () 바깥 부분에 모바일 버전을 작업을 안쪽 부분으로 올수록 점점 커지는 방식으로 작업을 시작했다.

그래서 작업이 보기에도 간단해 보이고 막상 실습을 할때도 모바일버전을 먼저 만들고 시작하니 조금더 수월했다

메뉴를 만드는 실습할 때 header의 높이값은 li태그에 float을 사용하여 3차원적인 특징 일부를 가지게 된다 그러므로 이 공간의 크기는 (width, height) 부모에게 영향을 전혀 줄 수 가 없다 그래서 부모(ul)태그에 높이값이 잡혀있지 않다 nav태그도 같다
즉 nav태그가 li태그의 공간을 인식하지 못하여 최종적으로 header의 태그가 h1 공간의 크기만 인식이 되는게 문제이다.
그래서 header태그의 높이가 3개의 메뉴 버튼의 높이까지 포함된 수치로 전환되게 만들기 위해
.buttons li 태그에 overflow: hidden; 을 사용하여 자식의 높이값을 부모가 인식할 수 있게 하였다
즉 header태그는 65 + 65의 값을 가져 130px을 가지게 된다.

이렇듯 배웠었던 내용들로 활용을 하다보니 까먹었었다고 해도 이제는 더이상 머릿속에 잊혀지지 않을 거 같다.

덴마크 쇼핑몰 만드는 실습도 너무 재밌게 강의해 주셔서 감사합니다

학습 후 소감

이때까지 배운내용을 바탕으로 실습하는 강의다 보니 시간적으로도 양으로도 많아질수 밖에 없다. 허나 많아 지더라해도 집중력이 흐트러지긴 커녕 더 집중을 하게된다. 알고 있던 내용을 활용해서 만드는 강의여서 그런지 너무 재미있고 즐겁게 학습하고있다. 오늘도 좋은 강의 해주신 김인권 강사님과 대구ai스쿨 쏴랑합니댜~

profile
멋진사나이

0개의 댓글