13.3.3 헤더 영역 개선하기

그림 13-7을 보면 이상한 점을 발견할 겁니다. 바로 헤더 영역이 안 보이죠. 정확히 말하면 안 보이는 것이 아니라 헤더 영역의 텍스트 색상이 검은색이라서 화면에 잘 안 보일 뿐이고 자세히 보면 보입니다. 그래서 다음과 같이 CSS 코드에서 헤더 영역의 메뉴 텍스트 색상을 흰색(white)으로 변경하고, absolute 값도 fixed로 변경합니다.

header{
  position:fixed; /* absolute -> fixed */
  color:white; /* black -> white */
  (중략)
}
header nav ul li button{
  (중략)
 color:white; /* 텍스트 흰색 */
}

코드를 적용하고 나면 그림 13-4처럼 헤더 영역이 잘 보입니다.