
in more detail in the next section. Expand All: Expands all collapsed code. Select Parent Tag: Selects the parent tag within the hierarchy based on your cursor position in the code. For example, if you're within the <td> tag of a table, selecting this option selects the <table> tag because the <table> tag is the parent for both the <tr> and <td> tags. Balance Braces: When working with client-side scripting languages such as JavaScript, click this button to highlight all code within the braces of a function. Line Numbers: Displays or hides line numbers. Highlight Invalid Code: Similar to the Highlight Invalid Code option (located in the View options menu in the Document bar), choose this option to enable or disable the highlighting of code that is considered invalid to a browser. Apply/Remove Comment: Choose the Apply Comment button to open the comment selection menu similar to Figure 3.55. It's from this menu that you have the option of inserting a HTML, CSS, JavaScript, or VB.NET, comment. Alternatively, you can click the Remove Comment button to delete an existing comment from the code view. Figure 3.55. Choose a comment type from the comment selection menu. [View full size image] Wrap Tag: Highlighting an element in code and selecting this button opens the Wrap Tag dialog. It from this dialog that you can enter an element that should wrap the selection. You'll notice that code hints also work within the Wrap Tag dialog. Recent Snippets: Selecting this button opens the recent snippets menu. From this menu, you can pick from a list of recently added snippets or even launch the Snippets panel to choose from Dreamweaver's library of snippets. Indent/Outdent Code: Choose from these two buttons to indent or outdent code. Format Source Code: Also available from the Commands menu, you can click and hold this option to apply the default Dreamweaver code formatting to either the entire page of code or to selected blocks of code. Alternatively, you can choose the Code Format Settings option to launch the Preferences dialog with the Code Format option preselected. More information about Preferences is provided in Chapter 5, "Defining Preferences." Of course, you can also show and hide the Code View toolbar by right-clicking the toolbar and checking/unchecking the Coding option from the context menu. Code Collapse Code collapsing provides the developer with the ability to highlight a segment of code and collapse it so that it's temporarily hidden from view. The obvious benefit to this is increased screen real-estate. To use the code collapse feature, follow these steps: 1. With the companydirectory.htm page open, switch to Code view if it's not already selected. 2. Highlight a section of code. Notice the line segments that appear in the line numbers column similar to Figure 3.56. Figure 3.56. Line segments appear in the line numbers column, indicating the segment of code that can be collapsed. [View full size image] 3. Choose one of the segment icons to collapse the code similar to Figure 3.57. Alternatively, you can choose the Collapse Selection button from the Code View toolbar. Notice the small plus (+) icon that appears next to the collapsed code.