Format, DataList Properties Dialog Box

The Format tab of the DataList Properties dialog box allows you to set the font and color of text in the list. You can specify options for the list as a whole or for individual portions of the list, such as the header, footer, and item types.

To access this dialog box

  1. In Microsoft Visual Web Developer, switch to Design view.

  2. Select or add from the Toolbox a DataList control.

  3. Right-click the DataList control and click Show Smart Tag.

    The DataList Tasks dialog box opens.

  4. Click Property Builder.

    The DataList Properties dialog box opens.

  5. Click the Format tab.

Tasks

UI Elements

Objects

The Objects tree displays a list of elements that you can set options for by selecting settings in the Appearance pane.

  • DataList
    Sets formatting options for the DataList control. Options you set for other elements override the settings for the list as a whole.

  • Header
    Sets the formatting of text in the header (for example, in a HeaderTemplate element).

  • Footer
    Sets the formatting of text in the footer (for example, in a FooterTemplate element).

  • Items
    Expands to display a list of child items for which you can set font and color options:

    Item

    Description

    Normal Items

    Sets the formatting of text in all the rows in the DataList control, unless there are different formatting settings set for Alternating Items.

    Alternating Items

    Sets the formatting of text in alternating rows, starting with the second row.

    Selected Items

    Sets the formatting for a row that is selected when the application is running on the client.

    Edit Mode Items

    Sets the formatting for a row that is in edit mode on the client.

  • Separators
    Sets the formatting of text that is displayed in separator cells (for example, in a SeparatorTemplate element).

Appearance

The Appearance pane displays a list of settings that you can set for any of the elements listed in the Objects tree.

  • Fore color
    The text color. Click the ellipsis button ( VisualStudioEllipsesButton screenshot ) to display the Color Picker dialog box.

    Note

    Not all color choices displayed in the Color Picker dialog box are supported in all browsers. For example, named colors beyond the basic colors are not supported in older browsers.

  • Back color
    The color behind the text. Click the ellipsis button ( VisualStudioEllipsesButton screenshot ) to display the Color Picker dialog box.

    Note

    Not all color choices displayed in the Color Picker dialog box are supported in all browsers. For example, named colors beyond the basic colors are not supported in older browsers.

  • Font name
    The name of the font used to display text. The drop-down list displays the names of fonts available on the computer you are using. Using the drop-down list, you can select a single font name. To specify multiple font names, enter additional font names into the Font name box, separating each name with a comma. The additional names do not have to represent fonts available on your system.

    Note

    It is best to select font names that are commonly available to users. It is recommended that you provide multiple font names, in order of preference, that cover the possibilities available to your users. For example, you might enter "Verdana,Arial,Helvetica" to specify various possibilities for a non-serif font.

  • Font size
    The text size, in units that you specify, or a named size such as "small." Select a named size or select Custom, the size, and then the units. For details about units, see CSS Length Units Reference.

    Note

    Select a font size unit appropriate to the browsers you are targeting. For example, older browsers do not allow you to specify absolute font sizes such as points or pixels. Even if you are targeting a browser that supports absolute sizes, it is a good idea to choose a relative size such as ems. This permits the user to resize the text according to personal preference.

  • Bold, Italic, Underline, Strikeout, Overline
    Options for formatting text. The options provided as check boxes are supported in all browsers.

  • Horizontal alignment
    Indicates how the content of an item or column is horizontally justified within the list (left, right, centered, or justified). This property has no effect if the DataList control is in flow layout mode.

  • Vertical alignment
    Indicates where the content of an item or column appears within a cell (top, bottom, or middle). This option is not available when you are setting options for the entire list. This property has no effect if the DataList control is in flow layout mode.

  • Wrap text within cell
    Specifies that the contents of a cell should wrap rather than being truncated.

See Also

Tasks

How to: Create Web Server Control Templates Using the Designer

Reference

DataList Web Server Control Overview

Concepts

ASP.NET Web Server Controls Templates