Introduction

In this video, we’ll examine the difference in the way two tools configure the properties of items. Properties are attributes, or descriptors of elements, the adjectives or adverbs. For example, in mark-up, a TD tag can have attributes describing its background color, how wide it is, whether its centered, left-justified, or right-justified, and so on. Being able to easily see and edit a list of properties for an item makes it easier for you to make changes.

Dreamweaver Section

In Dreamweaver, the text Property Inspector displays the current formatting properties of the text that is selected in the document. You can change the formatting by selecting new options, which are immediately applied to the style of the text. The Property Inspector also allows you to examine and edit the most common properties for the currently selected page element, such as an inserted form element. The contents of the Property Inspector vary, depending on which element is selected. You can also use the Property Inspector to apply HTML formatting or a CSS style. HTML formatting lets you select text-formatting options, such as font, size, bold, and italic, while CSS formatting lets you apply CSS attributes to the selected text or element.

As you format text using the Property Inspector, Dreamweaver keeps track of the formatting properties you assign to each text element and assigns each a label using the naming convention "style1," "style2," "style3," and so on. Alternatively, the developer can specify the name for the CSS class. If you assign the same formatting attribute to two or more text elements, Dreamweaver labels those elements with the same title, eliminating redundant style names. The label Dreamweaver applies to a given body of text can then be applied using the style pop-up menu, letting you build a library of styles within a page and apply those same styles by simply selecting the text element in the page and selecting a style from the styles pop-up menu. You can rename styles with more meaningful labels such as "heading1" and "body." The Tag Inspector and Property Inspector both allow you to view and edit a tag’s attributes. The Tag Inspector allows you to view and edit every attribute associated with a given tag. The Property Inspector shows only the most common attributes, but provides a richer set of controls for changing the values of those attributes and allows you to edit certain elements, such as table columns that don’t correspond to specific tags. When working with tables in Dreamweaver, using the Expanded Tables Mode adds temporary self-adding and spacing to tables and increases the table’s borders to simplify editing. From here, you can use the Properties panel to adjust table properties, such as cell height, width, and background color. You can also control page properties from the Page Properties dialog box, which is located in the Modify menu. From the Page Properties dialog box, you can set the properties for the current page’s appearance, links, and headings.

Visual Studio 2005 Section

In Visual Studio 2005, you use the Properties window to view and change the properties and events of selected controls that are located in the editors and designers. Visual Studio also allows you to access all properties through the Properties window as opposed to switching through a multitude of views, panels, and dialog boxes. You can also use the Properties window to edit and view file, project, and solution properties. If the Properties window is not open on your screen, it’s always available from the View menu. As well, certain controls have additional editing features available via property pages, such as this data grid. Where the Property page allows us to manage the controls templates, columns, and other properties, the Properties window displays different types of editing fields, depending on the needs of a particular property. These edit fields include edit boxes, drop down lists, and links to custom editor dialog boxes. Properties shown in grey are read-only.

The Properties window features the following elements: Object name: Lists the currently selected object or objects; only objects from the active editor are or designer are visible. When you select multiple objects, only properties common to all selected objects appear. Categorized: this lists all properties and property values for the selected object by category. You can collapse a category to reduce the number of visible properties. When you expand or collapse a category, you see a plus or minus sign to the left of the category name. Categories are listed in alphabetical order. Alphabetic: Alphabetically sorts all the design time properties and events for selected objects. Property pages: This displays the property page dialog box for controls that have built-in property builders. Properties: This displays the properties for an object. Many objects also have events which can be viewed using the Properties window. The Events displays all of the events for an object; and finally, we have the description pane at the bottom. This is like a mini Help screen for the property you are currently on and is updated automatically.

Conclusion

This concludes our comparison of Dreamweaver and Visual Studio 2005 property editors.