Collapsing code
Collapsing code is a productivity practice that makes it simple to copy or move large sections of code. Coders and developers also collapse code sections when they are looking for a particular element or section of a page and want to temporarily hide unneeded sections from view. Code can be collapsed either by selection or by logical element.
Select the first three Link items in the <nav> element.
Note the Collapse icon along the left edge of Code view; it indicates that the selection is currently expanded.
Click the Collapse icon to collapse the selection.
The selection collapses, showing only the first <li> element and a snippet of text from it.
You can also collapse code based on logical elements, like <ul> or <nav>. Notice that each line that contains an opening element tag also displays a Collapse icon.
Click the Collapse icon beside the line for the <nav> element.
The entire <nav> element collapses in the Code window, showing only an abbreviated snippet of the entire element. In either instance, the code hasn’t been deleted or damaged in any way. It still functions and operates as expected. Also, the collapse functionality appears only in Code view in Dreamweaver; on the web or in another application, the code will appear normally. To expand the code, just reverse the process, as described in the following section.