Share via

Text, Style Builder Dialog Box

  • Article

The Text page of the Style Builder dialog box makes it possible for you to define CSS text positioning attributes. You can either apply these attributes directly to HTML elements, or add them to CSS style rules.

To apply font attributes directly to text in HTML elements on your page, open your HTML document in Design view of the HTML Designer and select the text to format. Then choose Build Style from the Format menu to open the Style Builder dialog box, and select the Text option in the left pane.

Note   On the Format menu, the Build Style option becomes available when you open an HTML document in Design view and set its targetSchema property to a Web browser that supports HTML 4.0 or later and CSS styles.

When you apply styles to text selected in Design view, CSS style attributes are inserted inline into the HTML markup for your page. Switch to HTML view to review the new style attributes inserted.

To add text attributes to a CSS style rule defined in an external style sheet, place the cursor within the curly braces that follow the selector for the desired style. Then choose Build Style from the Styles menu to open the Style Builder dialog box, and select the Text option in the left pane.

Note   The Styles menu appears when you open an external CSS style sheet for editing. On the Styles menu, the Build Style option becomes available when you place the cursor within the curly braces { } that follow the selector for a style rule.

A CSS style class defined in an external style sheet can be applied to an element within the <BODY> of a Web page (in this case, including the <BODY> itself) by assigning the CSS style selector as the CLASS property for the element.

Options available on the Text page of the Style Builder dialog box include the following:

Alignment

Note   For the following alignment options, if you select <Not Set>, no code is added to the style.

  • Horizontal
    Sets the TEXT-ALIGN attribute value for text formatted in the style. Select <Not Set> (no option chosen), Left, Center, Right, or Justified. Letter and Line values that you set below are adjusted to accommodate the Justified attribute. For example, if you choose Left, the following CSS markup is inserted:

TEXT-ALIGN:left

  • Vertical
    Sets the VERTICAL-ALIGN attribute value for text formatted in the style. Select <Not Set> (no option chosen), Subscript text, or Superscript text. For example, if you choose Subscript text, the following CSS markup is inserted:

VERTICAL-ALIGN:sub

  • Justification
    Sets the TEXT-JUSTIFY attribute value for text formatted in the style. Select <Not Set> (no option chosen), Auto, Space words, Newspaper style, Distribute spacing, or Distribute all lines. For example, if you choose Newspaper style, the following CSS markup is inserted:

TEXT-JUSTIFY:newspaper

Note   Justification attributes are available only if you select Justified for the horizontal value.

Spacing Between

Sets spacing between letters and vertical spacing between lines of text formatted in the style.

  • Letters
    Sets the value for horizontal spacing between letters of text formatted in the style. Select <Not Set> (no option chosen), Normal, or Custom. If you select Custom, the fields to the right of Custom are available. Enter a value (1-512) in the number field and choose a unit option (px, pt, pc, mm, cm, in, em, or ex). The value that you set might be adjusted to accommodate the horizontal-justified attribute. The default unit option is pt. For example, if you choose Custom, type 5 in the number field, and then accept the default unit option, the following CSS markup is inserted:

LETTER-SPACING:5pt

  • Lines
    Sets the value for vertical spacing between lines of text formatted in the style. Select <Not Set> (no option chosen), Normal, or Custom. If you select Custom, the fields to the right of Custom are available. Enter a value from 1 to 512 in the number field and choose a unit option (px, pt, pc, mm, cm, in, em, ex, or %). The default unit option is pt. For example, if you choose Custom, type 5 in the number field, and then accept the default unit option, the following CSS markup is inserted:

LINE-HEIGHT:5pt

Note   The horizontal-justified attribute also modifies the vertical spacing of lines.

Text Flow

  • Indentation
    Sets the TEXT-INDENT attribute value for text formatted in the style. Enter a value (1-512) in the number field and choose a unit option (px, pt, pc, mm, cm, in, em, ex, or %). The default unit option is pt. For example, if you type 5 in the number field and then accept the default unit option, the following CSS markup is inserted:

TEXT-INDENT:5pt

  • Text Direction
    Sets the DIRECTION attribute value for text formatted in the style. Select <Not Set> (no option chosen), Left to right, or Right to left. For example, if you choose Left to right, the following CSS markup is inserted:

DIRECTION:ltr

Note   When the attribute is <Not Set>, no code is added to the style.

See Also

Introduction to Cascading Style Sheets | Working With CSS Styles | Background, Style Builder Dialog Box | Font, Style Builder Dialog Box | Position, Style Builder Dialog Box | Layout, Style Builder Dialog Box | Edges, Style Builder Dialog Box | Lists, Style Builder Dialog Box | Other, Style Builder Dialog Box | Color Picker Dialog Box