[해피CGI][cgimall] 크롬 확장프로그램 비주얼 인스펙터

 

[F12]를 누르면 나오면 개발자도구는 무척 유용합니다.

개발자도구는 웹페이지의 구성요소를 확인할 수 있고 바로 코드를 삽입하거나 수정해서 변화된 페이지를 바로 볼 수 있습니다.

그러나 개발자도구는 css의 컬러값이 몇개가 사용되고 몇개의 이미지가 사용되는지 바로 확인할 수가 없습니다.

이러한 문제를 해결해줄수 있는 프로그램이 크롬의 확장 프로그램인 비주얼 인스펙터입니다.

 

팝업에서 구성요소 중 하나를 클릭하면 어떤 요소인지 알려주며 직접 수정도 할 수 있습니다.

색상은 물론 위치와 사이즈도 변경할 수 있습니다.

또한 이렇게 고쳐본 결과물을 이미지 파일로 받을 수도 있습니다.