관련 코드로 이동



코드 탐색기에는 페이지의 특정 선택 영역과 관련된 코드 소스 목록이 표시됩니다. 여기에서 내부 및 외부 CSS 규칙, 서버측 포함, 외부 JavaScript 파일, 상위 템플릿 파일, 라이브러리 파일, iframe 소스 파일과 같은 관련 코드 소스로 이동할 수 있습니다. 코드 탐색기에서 링크를 클릭하면 관련 코드를 포함하는 파일이 열립니다. 관련 파일이 활성화된 경우 파일은 관련 파일 영역에 나타납니다. 관련 파일이 활성화되지 않은 경우 선택한 파일은 [문서] 윈도우에서 별도의 문서로 열립니다.

코드 탐색기에서 CSS 규칙을 클릭하면 해당 규칙으로 바로 이동됩니다. 규칙이 파일에 포함되어 있으면 [분할] 뷰에 규칙이 표시됩니다. 규칙이 외부 CSS 파일에 포함되어 있으면 파일이 열리고 기본 문서 위쪽의 관련 파일 영역에 규칙이 표시됩니다.

[디자인] 뷰, [코드] 뷰, [분할] 뷰를 비롯하여 코드 관리자에서 코드 탐색기에 액세스할 수 있습니다.

코드 탐색기를 사용하는 작업에 대한 Dreamweaver 엔지니어링 팀의 비디오 개요를 보려면 www.adobe.com/go/dw10codenav_kr을 참조하십시오.

라이브 뷰를 사용한 작업, 관련된 파일 및 코드 탐색기에 대한 비디오 자습서는 www.adobe.com/go/lrvid4044_dw_kr을 참조하십시오.

코드 탐색기 열기

 페이지의 원하는 위치에서 Alt 키를 누른 상태로 클릭(Windows)하거나 Command+Option을 누른 상태로 클릭(Macintosh)합니다. 코드 탐색기에는 클릭한 영역에 영향을 끼치는 코드에 대한 링크가 표시됩니다.

링크를 닫으려면 코드 탐색기 바깥쪽을 클릭합니다.

참고: 코드 탐색기 표시기 를 클릭하여 [코드 탐색기]를 열 수도 있습니다. 이 표시기는 2초 동안 마우스의 움직임이 없을 때 페이지의 삽입 포인터 근처에 나타납니다.

코드 탐색기를 사용하여 코드로 이동

  1. 사용할 페이지 영역에서 코드 탐색기를 엽니다.

  2. 이동할 코드를 클릭합니다.

코드 탐색기는 관련 코드 소스를 파일별로 그룹화하고 파일을 알파벳순으로 나열합니다. 예를 들어, 외부 파일 세 개의 CSS 규칙이 문서의 선택 영역에 영향을 끼칠 수 있습니다. 이 경우 코드 탐색기는 파일 세 개를 비롯하여 선택 영역과 관련이 있는 CSS 규칙을 나열합니다. CSS가 지정된 선택 영역과 관련이 있을 경우 코드 탐색기는 [현재] 모드의 [CSS 스타일] 패널과 같이 작동합니다.

CSS 규칙에 대한 링크를 가리키면 코드 탐색기는 규칙 속성의 도구 설명을 표시합니다. 이러한 도구 설명은 이름이 같은 여러 규칙을 구별하려는 경우 유용합니다.

코드 탐색기 표시기 비활성화

  1. 코드 탐색기를 엽니다.

  2. 오른쪽 아래 모서리에 있는 [표시기 비활성화]를 선택합니다.

  3. 링크를 닫으려면 코드 탐색기 바깥쪽을 클릭합니다.

코드 탐색기 표시기를 다시 활성화하려면 Alt 키를 누른 상태에서 클릭(Windows)하거나 Command+Option을 누른 상태에서 클릭(Macintosh)하여 코드 탐색기를 열고 [표시기 비활성화] 옵션의 선택을 취소합니다.