네비게이션바
-
카카오톡 클론 코딩 #15 네비게이션 바 CSS이거 공부 했더니 어때?/HTML & CSS & JS 2020. 11. 21. 01:32
이번 포스팅에서는 네비게이션 바를 만들어 보도록 하겠습니다. 앞선 포스트에서 했던 방식대로, 제일 먼저 CSS폴더에 nav-bar.css라는 새 파일을 만들고, style.css에 nav-bar.css를 @import합니다. 그럼 네비게이션 바에 배경색을 지정해주면, 네비게이션 바가 잘 선택 되어있는 지 확인할 수 있습니다. 상태표시줄, 헤더, 네비게이션바는 화면을 스크롤하더라도 그 자리 그대로를 지키고 있습니다. 그래서 position: fixed;를 이용하여 자리를 고정시켜 주겠습니다. (body의 padding에 둘러싸여 있도록 한 설정 제거) position: fixed는 기존에 있던 위치에서 다른 위치에 고정시키도록 설정한 것이기 때문에, position: fixed를 쓸 때는 꼭 width를 ..