v) Document toolbar overview

The Document toolbar contains buttons that let you toggle between different views of your document quickly: Code, Design, and a split view that shows both Code and Design views.

The toolbar also contains some common commands and options related to viewing the document and transferring it between the local and remote sites.

The following options appear in the Document toolbar:

Show Code View Displays only the Code view in the Document window.

Show Code and Design Views Splits the Document window between the Code and the Design views. When you select this combined view, the option Design View on Top becomes available in the View Options menu.

Show Design View Displays only the Design view in the Document window.

Note: If you are working with XML, JavaScript, CSS, or other code-based file types, you cannot view the files in Design view and the Design and Split buttons are dimmed out.

Document Title Allows you to enter a title for your document, to be displayed in the browser’s title bar. If your document already has a title, it appears in this field.

File Management Displays the File Management pop-up menu.

Preview/Debug in Browser Allows you to preview or debug your document in a browser. Select a browser from the pop-up menu.

Refresh Design View Refreshes the document’s Design view after you make changes in Code view. Changes you make in Code view don’t automatically appear in Design view until you perform certain actions, such as saving the file or clicking this button.

Note: Refreshing also updates code features that are DOM (Document Object Model) dependent, such as the ability to select a code block’s opening or closing tags.

View Options Allows you to set options for Code view and Design view, including which view should appear above the other. Options in the menu are for the current view: Design view, Code view, or both.

Visual Aids Lets you use different visual aids to design your pages.

Validate Markup Lets you validate the current document or a selected tag.

Check Browser Compatibility Lets you check if your CSS is compatible across different browsers.

SEE ALLAdd a note
Add your Comment

New to site? Create an Account


Lost Password?

Already have an account? Login