1. 완성본 [동영상] 완성본 2. HTML HTML 구조는 크게 어려운 것이 없다. The Nav Home About Work Projects 3. CSS 내가 어렵다고 생각한 것은 주석을 달아놨다. 엄청나게 어려운 것은 없다. * { margin: 0px; padding: 0px; box-sizing: border-box; } nav { display: flex; justify-content: space-around; align-items: center; /* 요소의 최소 너비 지정, height 속성 무시 vh단위는 브라우저 안쪽 높이(window.innerHeight)을 기준으로 설정된다. 하지만 태블릿이나, 모바일의 경우에는 뷰 포트에 따라 맞춰짐*/ min-height: 8vh; backgro..

1. 완성본 이번 강의에서 만들 완성본 영상입니다. 2. HTML, CSS 이번에는 스케치 없이도 바로 구조가 어떻게되있는지 알 수 있기 때문에 따로 하지 않겠습니다. 그래서 먼저 HTML과 CSS를 이용해서 다음과 같은 메뉴 디자인만 만들어보려고 합니다. 코드는 다음과 같습니다(CSS 헷갈리시는 분들을 위해 약간의 주석을 달아놓았습니다.). HTML Menu Slide Menu 1 Menu 2 Menu 3 Menu 4 Menu 5 Menu 6 CSS // 전체 태그에 box-sizing을 적용합니다. box-sizing에 border 박스를 하면 // 전체 픽셀을 유지한 채로 padding이나 border의 크기만을 늘릴 수 있습니다. // 예를 들면, 가로 300px, 세로, 300px의 블록이 있고..