Format Text Styles


After completing this topic, you will be able to format text styles in the style sheet.


Steps:

  1. Create and format a text style for displaying programming code in a web page.

    Step 1
  2. Create a new text style for displaying programming code in a web page.

     

    Click the Add Style menu.

    Step 2
  3. Click the Text list item.

    Step 3
  4. Name the style Code.

     

    Enter the desired information into the Style name field. Enter

     a valid value
     e.g.
     "Code"
    .

    Step 4
  5. Press [Enter].

    Step 5
  6. Although this is the first text style in the style sheet, notice that the style was not created as a default style.

     

    You cannot set a default text style. All text styles are non-default styles, which means that you must manually apply the style to selected text in a web page.

    Step 6

  7. Apply a Courier font to the style.

     

    Click the Font Family button.

    Step 7
  8. Click the Courier New, Courier, monospace list item.

    Step 8
  9. Change the color of the text to purple.

     

    Click the Text Color button.

    Step 9
  10. Click the purple color in the Web Colors palette.

    Step 10
  11. Click the Ok button.

    Step 11
  12. Save the style sheet.

     

    Click the Save button.

    Step 12
  13. When using a text style, you must select all of the text to be formatted. We have opened the SaveFile web page and selected the [CTRL+S] text.

     

    Format the selected text with the Code style.

     

    Click the Styles button.

    Step 13
  14. Click the Code - Text list item.

    Step 14
  15. The formatting from the text style is applied to the selected text.

    Step 15

After completing this topic, you are able to format text styles in the style sheet.