지금 당장의 티스토리 블로그도 그렇고 프론트엔드를 하면 엄청난 코드 수에 원하는 구역을 쉽사리 찾지 못하는 경우가 있다.
F12를 누르면 개발자 도구 창이 뜨게 된다.
여기서 개발자 도구 창의 왼쪽 맨 위를 보면 사각형에 커서가 있는 아이콘이 있다.
이걸 누르고 원하는 부분에 마우스를 가져다 대면
그 부분과 관련된 HTML(파란색 원)과 바로 밑에 CSS(빨간색 원)가 보인다.
이렇게 쉽게 찾고 싶은 곳을 알 수 있다.
수정할 부분에 대해서 개발자 도구를 이용해 미리 적용시켜 보는것도 가능하다.
예를 들어, 구글의 배경색을 검은색으로 하고 Gmail 과 이미지의 글자를 바꾸고 싶다면
위의 방법으로 그 부분의 HTML과 CSS로 가서 코드를 더블클릭하고 수정하면 된다.
