[편집] > [환경 설정](Windows) 또는 [Dreamweaver] > [환경 설정](Mac)을 클릭합니다.
마지막 업데이트 날짜
2021년 4월 27일
스크롤하지 않고도 문서의 섹션을 볼 수 있도록 Dreamweaver에서 코드를 축소 및 확장하는 방법에 대해 학습합니다.
코드 조각을 숨기거나(접기라고도 함) 펼쳐서 스크롤하지 않고도 문서의 다른 섹션을 볼 수 있습니다.
예를 들어, 페이지 아래쪽에 있는 div 태그에 적용되는 head 태그 내의 모든 CSS 규칙을 보려면, head 태그와 div 태그 사이의 코드를 접어서 두 코드 섹션을 동시에 보세요.
축소하려는 코드의 일부를 선택할 수 있습니다. 태그 블록을 기준으로 HTML, PHP, XML 및 SVG 파일의 코드를 축소할 수도 있습니다. CSS, Less, Sass, SCSS, JS 파일에서는 중괄호를 기준으로 코드를 접을 수 있습니다.
- HTML 파일: Dreamweaver는 열기 및 닫기 HTML 태그 사이의 코드를 축소하며, 해당되는 경우 원래 속성을 축소된 코드에 표시합니다. Dreamweaver는 블록 내의 코드가 태그 선택기, 찾기 및 바꾸기, 줄 이동, 요소 빠른 보기, 라이브 보기 또는 실행 취소/다시 실행을 통해 초점을 받으면 자동으로 펼쳐집니다.
선택 항목이 변경되면 코드가 자동으로 다시 접힙니다.
- CSS, Less, Sass, SCSS, JS 파일: 중괄호 안의 코드가 접히고 미리보기가 {...}로 표시됩니다.
- PHP 파일: PHP 코드 블록 외에 HTML 요소, CSS 및 JS 코드 블록이 축소됩니다.
메모
Dreamweaver 템플릿에서 생성된 파일은 템플릿 파일(.dwt)에 축소된 코드 부분이 있더라도 모든 코드가 완전히 확장된 상태로 표시됩니다.
코드 폴딩 크기 환경 설정
기본 코드 폴딩 크기는 두 줄입니다. 이 기본 설정을 사용하면 최소 두 줄 이상의 코드로 구성된 모든 코드 부분을 축소할 수 있습니다. 두 줄 미만인 코드 조각은 코드를 선택하여 접을 수 있습니다.
코드 접기의 최소 줄 수를 변경하려면:
범주 목록에서 [코드 형식]을 클릭하고 최소 코드 접기 크기를 지정합니다.
코드 부분 축소 및 확장
기본적으로 코드 보기에서 모든 코드는 확장된 모드입니다.
그러나 여러 줄을 선택한 상태에서 축소하여 코드를 축소할 수 있습니다. 구문에 따라 코드를 접을 수도 있습니다 - 태그 블록 또는 중괄호.
메모
코드 블록의 축소 또는 확장 상태는 Dreamweaver 세션 내내 유지됩니다.
태그 블록 또는 중괄호를 기준으로 코드 축소
태그 블록 또는 중괄호를 기준으로 코드를 접으려면:
코드 보기에서 코드 접기 크기 환경설정에 지정된 코드 접기 줄 수보다 큰 코드 블록에 해당하는 줄 번호 옆에 작은 삼각형이 나타납니다.
코드를 축소하거나 확장하려면 코드를 클릭합니다.
메모
문서의 모든 축소된 코드를 확장하려면 키보드 단축키 Control+Alt+E(Win) 또는 Command+Alt+E(Mac)를 사용할 수 있습니다.
선택 영역을 기준으로 코드 축소
선택을 기준으로 코드를 접으려면:
코드 보기에서 축소하려는 코드 부분을 선택합니다.
삼각형 아이콘을 클릭하여 선택 항목을 접고 펼칩니다.
키보드 단축키를 사용하여 코드 축소 및 확장
|
명령 |
Windows |
Macintosh |
|
선택물 축소 |
Ctrl+Shift+C |
Command+Shift+C |
|
외부 선택물 축소 |
Ctrl+Alt+C |
Command+Alt+C |
|
선택물 확장 |
Ctrl+Shift+E |
Command+Shift+E |
|
전체 태그 축소 |
Ctrl+Shift+J |
Command+Shift+J |
|
외부 전체 태그 축소 |
Ctrl+Alt+J |
Command+Alt+J |
|
모두 확장 |
Ctrl+Alt+E |
Command+Alt+E |
축소된 코드 부분을 복사하여 붙여넣기
축소된 코드 부분을 클릭하여 선택합니다.
[편집] > [복사]를 선택합니다.
코드를 붙여 넣을 지점에 커서를 놓습니다.
[편집] > [붙여넣기]를 선택합니다.
