Modifying a DHTML Web Page and Positioning Elements

To place text on a DHTML page, you can just position your cursor in the design-time pane (the right-hand pane) of the DHTML Page Designer and begin typing. As you type, you are actually defining the text of an HTML page that will be stored with the DHTML Designer.

Every time that you press the Enter key as you type, you will define a new Paragraph element in the underlying HTML. A Paragraph element is a section of HTML that is surrounded by a … pair of tags. The basic function of the paragraph tags is to instruct the browser to set off the element from other elements (usually by adding an extra carriage return at the end of the displayed element).

The first element of the paragraph tag pair (the ) can contain a great deal of additional information about the formatting of the entire object, however. A complete Paragraph element might look like the following in the underlying HTML code:

Customer
Survey

The DHTML Page Designer acts like a Web authoring tool in that it enables you to just type text while it provides all the underlying formatting information for the Paragraph tags. You can use a word processor–like interface with toolbar items and menus to format the text and thus change the Paragraph tags, as well as inner HTML tags.

The inner HTML tags go inside the Paragraph tags and control formatting attributes of the text, such as boldface, italic, and underscore.

You can keep track of the paragraph objects that you place on the DHTML Designer’s surface, as well as any internal formatting tags, by checking the left-hand pane of the DHTML Page Designer and opening the tree of objects under the Document object.

You can add user interface objects to the DHTML page from the ToolBox, just as you do for a standard VB application. However, these objects are not the standard controls that you are used to from VB development. Instead, the objects in the DHTML application’s ToolBox represent elements of the HTML interface. Placing such an object on the DHTML Page Designer surface creates HTML code to implement the object.

When you place a DHTML object on the designer’s surface, you will position the object either in a relative or absolute position. When you place an object in a relative position, it will show up attached to the currently selected Paragraph object. If other objects already belong to the current Paragraph, the object will appear at the end of the list. Objects placed in relative positions will adjust their positions on the screen of the end user’s machine according to the screen’s physical capabilities.

When you place an object in an absolute position, it will always show up exactly as you positioned it on the designer’s surface. Absolute position gives you more control over the exact placement of an object, but it also deprives your page of flexibility in adjusting to different environments.