jsarrow (1) 썸네일형 리스트형 <CSS> 반응형 웹 디자인 - 메뉴바 (3) 지난 (1), (2) 글에서 반응형 웹 디자인의 메뉴바를 완성하였으나, 드림코딩 강의를 참조하여 코드를 다시 수정해보았다. 일명 리팩토링! 하였다. 디자인은 위처럼 에어비앤비를 테마로하여 다시 만들어보았다. - HTML 전체 헤더는 클래스명 nav로 하여 section 태그로 만들었다. 지난번과 달리 nav를 감싸는 더 큰 div 박스는 불필요하여 제거하였다. 브랜드명에는 로고 이미지도 새롭게 추가하였다. 메뉴는 지난번처럼 중단점 이하에서 나타나는 메뉴를 따로 만들지 않고, 하나의 메뉴만 만들고 이를 CSS에서 조작하여 미디어 쿼리를 통해 중단점 이하일 경우 다르게 나타나도록 만들었다. 코드가 훨씬 간결하고 보기 편해졌다. 맨 하단의 클래스 fas는 중단점 이하에서 나타나는 햄버거 모양의 메뉴바 아이콘이.. 이전 1 다음
