Del via


How to: Navigate in the HTML Editor in Visual Web Developer

The HTML designer provides you with a number of ways to navigate in your document. The navigation facilities are particularly useful if you are working with a long document or one with deeply nested elements. You can use the following:

  • The Document Outline window, which presents a tree view of your document.

  • The tag navigator, which displays the currently selected tag in the context of its parent, child, and peer tags.

  • Tag matching to identify the opening and closing tags for an element. Tag matching can help you distinguish the current element from others, which is especially useful when you have many nested elements on the page.

To navigate by using the Document Outline window

  1. On the View menu, click Document Outline. If you are in Source view, right-click the document and then click Synchronize Document Outline.

    The Document Outline displays a tree view of the elements in your document. The exact elements that are displayed depend on which view you are in:

    • In Design view, the outline displays elements in the body of the document.

    • In Source view, the outline shows the body element as well as elements in the head, the page directive, and script and code elements, if any.

  2. In the Document Outline window, expand or collapse sections, as needed.

  3. Click an element to navigate to it.

    The element you click is selected in the designer.

To navigate by using the tag navigator

  1. At the bottom of the designer window, click the tag to which you want to move.

  2. To move higher in the tag hierarchy, click the left arrow button in the navigator. To move deeper in the tag hierarchy, click the right arrow button.

    Note

    If you have a deep hierarchy, the tree view might not fit into the space available. To scroll higher in the tag hierarchy, click the left arrow button in the navigator. To scroll deeper in the tag hierarchy, click the right arrow button.

To identify matching tags by using tag highlighting

  • In Source view, place the insertion point anywhere within an element.

    The element's opening and closing tags are displayed. Because tag highlighting is performed as a background task, there might be a small delay before the tags are highlighted.

See Also

Tasks

How to: Collapse and Expand HTML Elements in Visual Web Developer

Concepts

HTML Editor Tag Navigation in Visual Web Developer

Reference

Document Outline Window