Editing Styles

There are hundreds of tasks that you can perform in Flare by using styles. Following are some common tasks that you might perform when editing styles.

• Auto-numbers
  • Formats Auto-numbering can be used when you want to create content where certain portions are numbered automatically. This can be accomplished through the use of auto-number formats. See Creating Auto-Number Formats for Styles.
• Breadcrumbs
  • Look After you create breadcrumbs for online output by using the breadcrumbs proxy, you can modify the look of those breadcrumbs by using styles. There are numerous ways that you can change the look of breadcrumbs. See Using Styles to Determine the Look of Breadcrumbs.
• DITA
  • Edit styles In this version of Flare, you cannot edit DITA files natively. However, you can edit style classes that result from imported DITA elements. See Editing DITA Styles.
• Equations
  • Look You can change the appearance of all equations through the use of the <MadCap|equation> style tag. See Editing Equations.
• Footnotes
  • Borders You can modify the default border that is added above footnote comments. You can change the border thickness, color, style, and other settings. You can also remove the border altogether. See Editing the Border Above Footnotes.
  • Comment font settings You can modify the font in a footnote comment. This includes changing the font family, size, color, case, and more. See Editing Footnote Comment Font Settings.
  • Comment position You can change the location where a footnote comment is placed in the output (e.g., end of page, document, chapter, section, book). See Editing Footnote Comment Position.
  • Comment spacing You can modify the spacing for the footnote comment text. This includes the ability to change the spacing above or below the comment text, the white space between words or characters, or the indentation before the number and text. See Editing Footnote Comment Spacing.
  • Number formats By default, a decimal number (e.g., 1, 2, 3) is used when you insert a footnote. However, you can select a different format. For example, you can change the format to uppercase alpha (e.g., A, B, C) or lowercase Roman (e.g., i, ii, iii). You can also replace the number with a symbol, such as an asterisk. See Editing Footnote Number Formats.
  • Numbers - look You can change the look of the footnote numbers (both in-text and in-comment), by creating and modifying <span> style classes. Alternatively, you can use the <MadCap|footnote> style or a class of it to modify the look of both the in-text and in-comment footnote numbers. The difference is that the <span> style lets you change the look of one or the other, rather than both at the same time. See Editing the Look of Footnote Numbers.
  • Restart numbering When you insert footnotes, the numbers are incremented throughout your manual. However, you can restart the numbering at a certain location (e.g., at the beginning of the next chapter or section). See Restarting Footnote Numbering.
• Glossaries

  • Look of generated glossary You can use styles to change the appearance of a glossary in print-based output. You can modify the look of individual elements within the glossary, as well as the entire container holding the glossary. See Using Styles to Change the Look of a Glossary.

    Note: If you want to change the look of glossaries in online output, you can do so by modifying styles within your skin. See Editing Skin Settings and Specifying Skin Style Settings.

  • Ignoring glossary terms You can configure a target to convert glossary terms to links automatically when they are found in topics. In addition, there is a way to purposely ignore some terms so that they are not converted to links. This can be done by setting the mc-disable-glossary-terms property on a style. By default, this feature is turned on for <h1> through <h6> styles, as well as hyperlinks (i.e., content with the <a> tag). This means that if a glossary term is found in a heading or text hyperlink, it will not be converted to a link. However, if the same term is found in, say, a regular paragraph, the term will be converted to a link (as long as you do not turn this feature on for that paragraph style). See Ignoring Glossary Terms in Styles.
• Indexes

  • Look of generated index for print output If you incorporate a generated index into your printed output (see Creating a Topic for a Print Index), you can customize the way the index entries look in the output. This includes adjusting properties such as font family and size, word space, and space above/below. You can also change the look of the entire container holding the generated index. See Determining the Look of Your Print Index.

    Note: If you want to change the look of indexes in online output, you can do so by modifying styles within your skin. See Editing Skin Settings and Specifying Skin Style Settings.

• Links
  • Concept links You can edit the style (e.g., font, color, wording) of a concept link. When you edit the style for a concept link, the style changes for all concept links in any topics in your project. See Editing Concept Links.
  • Cross-references You can edit the style settings (e.g., format, font, color) of cross-references. This includes the ability to incorporate page numbers and context-sensitivity into a cross-reference format. See Editing Cross-Reference Style Formats and Editing Text for Context-Sensitive Cross-References.
  • Drop-down text You can edit drop-down effects that you have inserted into topics. See Editing Drop-Down Text.
  • Expanding text You can edit expanding text effects that you have inserted into topics. See Editing Expanding Text.
  • Keyword links You can edit keyword links that you have inserted into topics. See Editing Keyword Links.
  • Related topics links You can edit related topics links that you have inserted into topics. See Editing Related Topics Links.
  • Relationship links You can edit the style settings (e.g., font, color, leader format) of relationship links. See Editing Relationship Link Styles.
  • Text hyperlinks You can edit the style settings (e.g., font, color) of text hyperlinks. See Editing Text Hyperlinks.
  • Text popups You can edit the style (e.g., font, color) of the hotspot or the popup body in text popups. See Editing Text Popups.
  • Togglers You can edit the style (e.g., font, color) of the hotspot for togglers. See Editing Togglers.
  • Topic popups You can edit the style (e.g., font, color) of the hyperlink for topic popups. See Editing Topic Popups.
• List of concepts
  • Look After you use the concepts proxy to create a list of concepts, you can change the look of that list by using styles. You can modify the look of individual entries in the list, as well as the entire container. See Using Styles to Determine the Look of a List of Concepts.
• List of elements
  • Look After you use the list-of proxy to create a list of elements (such as a list of figures or tables), you can use styles to determine the look of the generated list. See Using Styles to Determine the Look of a List of Elements.
• Lists
  • Alignment You can format lists or items within them so that the text is aligned right, left, centered, or justified. See Aligning Lists.
  • Background You can set a background color and/or image on lists or items within them. See Setting the Background for Lists.
  • Borders You can add borders around lists or items within them. Borders can be added on any side (left, right, top, bottom), or all around. See Setting Borders for Lists.
  • Images for bullets You can change the image used for bullets in lists. For example, if you have a small check mark icon that you want to use instead of round bullets, you can select your image. See Selecting Images for List Bullets.
  • Indentation You can indent lists or items within them so that they start or end at a certain distance from the left or right side of the window or page frame. See Indenting Lists.
  • Line spacing You can specify the amount of spacing between lines of text in a list. See Setting Line Spacing for Lists.
  • Page and column breaks You can apply a page or column break to lists or items within them. You might do this if you want a list to end with a particular item on one page and begin with another list item on the next page or column. For example, you could create a class of the <li> style tag and you could call it something like "PageBreakBefore" (li.PageBreakBefore). For most items in a list, you could use the parent <li> tag, but if you want a page break to occur on a particular list item, you could apply your li.PageBreakBefore style to it. This feature is used for print-based output. See Setting Page and Column Breaks for Lists.
  • Spacing above/below You can specify the amount of spacing above and below lists or items within them. See Setting Spacing Above and Below in Lists.
  • Type You can specify the type of list (e.g., circle, square, decimal, upper alpha) for a style. See Specifying a List Type for a Style.
• Mini-TOCs
  • Look of mini-TOC in online output You can use the <MadCap|miniTocProxy> style to modify the look of mini-TOCs in your online output. See Using Styles to Determine the Look of an Online Mini-TOC.
  • Look of mini-TOC in print-based output For generated mini-TOCs, you can use styles to adjust properties such as font family and size, indentation, word spacing, spacing above/below, TOC width, page number alignment, and leader settings (e.g., the dots between the headings and the numbers). The headings in the mini-TOC will take on the settings that you specify. You can also modify the look of the entire container holding the generated mini-TOC. See Using Styles to Determine the Look of a Print Mini-TOC.
• Paragraphs and headings
  • Alignment You can format a paragraph so that the text is aligned right, left, centered, or justified. See Aligning Paragraphs.
  • Background You can set a background color and/or image on a paragraph. See Setting the Background for Paragraphs.
  • Borders You can add borders around a paragraph. Borders can be added on any side of a paragraph (left, right, top, bottom), or all around it. See Setting Borders for Paragraphs.
  • Drop caps/initial caps You can create an effect on a paragraph so that the initial letter is different than the others and drops down to the lines below. See Creating Drop Caps Effects and Creating Initial Caps Effects.
  • Hyphenation You can specify whether words at the end of a line in a paragraph should be hyphenated before continuing to the next line. You can also determine minimum word and character settings to be used for hyphenation. See Setting Hyphenation.
  • Indentation You can indent paragraphs so that they start or end at a certain distance from the left or right side of the window or page frame. See Indenting Paragraphs.
  • Line spacing You can specify the amount of spacing between lines in a paragraph. See Setting Line Spacing.
  • Next style You can specify that a particular style should be used when you press Enter at the end of the current style. For example, after you type text for a heading and press Enter, you might want the next style to be something like p.TopicText, rather than the main <p> tag. See Setting a "Next" Style.
  • Page and column breaks You can apply a page or column break to a paragraph or heading. For example, you might do this if you want the paragraph or heading to start at the beginning of the next page or column. This feature is used for print-based output. See Setting Page and Column Breaks.
  • Positioning After you add a paragraph or heading to a topic, you can adjust its positioning on the page. For example, you can float it to the left of the page layout frame to create a side heading. You can do this by applying a positioning setting on the style used by the paragraph. See Positioning Paragraphs and Heading Examples.
  • Short line elimination You can use this feature to automatically adjust word spacing if the last line of a paragraph is only a certain number of characters long. Therefore, the spacing may be widened to make the last line longer, or the spacing may be narrowed to bring the words in the last line up to the previous line. See Setting Short Line Elimination.
  • Spacing above/below You can set the amount of spacing above and below paragraphs. See Setting Paragraph Spacing Above and Below.
  • Widow and orphan control You can use widow and orphan control to avoid instances where "leftover" lines from a paragraph are shown at the top or bottom of a page or column. See Setting Widow and Orphan Control.
• Pictures
  • Background You can add background settings to an image. This includes the ability to specify a color, another image, and a repeating pattern for the background image. Normally you would not see an image's background, but if you give the image a certain amount of padding, you would see the background around the edges of it. See Adding Backgrounds to Pictures.
  • Background image on topics You can add a background image on topics by using the <body> style tag. See Setting a Background Image on Topics.
  • Borders You can add borders around an image, specifying the border size, color, and type. See Adding Borders to Pictures.
  • Margins You can adjust the margins around an image so that there is extra space above, below, to the right, or to the left of it. See Adding Margins to Pictures.
  • Padding You can add padding (i.e., extra space) between an image's border and the image itself. See Adding Padding to Pictures.
  • Positioning After you insert a picture, you can adjust its positioning on the page. This includes the ability to wrap text around an image or float a picture outside the frame holding the regular flow of text. See Positioning Pictures.
  • Resize You can resize many images at once by using the <img> style tag in the Stylesheet Editor. See Resizing Pictures.
  • Thumbnails When you insert images into Flare content, you can specify that the pictures should be displayed as thumbnails (i.e., much smaller versions of the image) in the output. This is a way to condense topics so that pictures are not taking up as much real estate. When you use this feature, you can specify ways that the user can enlarge the image to see its full size (e.g., by hovering over the thumbnail, by clicking the thumbnail). See Showing Images as Thumbnails in Output.
• QR codes
  • Background You can add background settings to a QR code. This includes the ability to specify a color, image, and a repeating pattern for the background image. Normally you would not see a QR code's background, but if you give the QR code a certain amount of padding, you would see the background around the edges of it. See Adding Backgrounds to QR Codes.
  • Borders You can add borders around a QR code, specifying the border size, color, and type. See Adding Borders to QR Codes.
  • Margins You can adjust the margins around a QR code so that there is extra space above, below, to the right, or to the left of it. See Adding Margins to QR Codes.
  • Padding You can add padding (i.e., extra space) between a QR code's border and the QR code itself. See Adding Padding to QR Codes.
  • Resize You can resize QR codes with various methods. See Resizing QR Codes.
• Redacted text

  • Set Flare supports redacted text, which is text that is "blacked out" in Adobe PDF or Microsoft XPS output. This is much more efficient than attempting to black out text or other content after the document has been printed. You can set redacted text on any kind of content (e.g., characters, paragraphs, images, tables). You can do this locally at the font level by highlighting each piece of content, or you can specify redaction on a style and then apply that style to content whenever necessary. It is recommended that you use styles whenever possible. See Setting Redacted Text on Content.

• Rulers (horizontal lines)
  • Edit After you insert a ruler ("horizontal line") in a topic, you can edit its settings (e.g., size, color, position) by modifying the <hr> style in the Stylesheet Editor. See Editing Rulers.
• Search
  • Look of highlighted search terms When users perform searches in your online output, the keywords that are found are highlighted in the topics. The background for each term found in a topic is highlighted in a different color. In Flare you can create styles for this purpose and change not only the color background, but other settings as well (e.g., font style, text decoration). See Using Styles to Change the Look of Highlighted Search Terms.
• Spell check
  • Skip words You can use styles to skip certain words when performing a spell check. See Using Styles to Skip Words in Spell Check.
• Tables

  • Using table style sheet You can modify the look and feel of multiple tables at once by editing the properties in a custom table style sheet. These table style sheets let you easily and quickly create patterns and different looks for tables. See How to edit styles in a table style sheet.

  • Using topic style sheet You can modify the look and feel of multiple tables at once by editing standard HTML table tags (e.g., <table>, <th>, <td>, <tr>) in your topic style sheet. For example, you might use these styles in order to control the look of the text that appears in your table headings (<th> style) or within the cells (<td> style). See Editing Table Styles in Topic Style Sheets.

    When you insert a table, it is set up by default to use standard table tags in the individual cells (e.g., <th> for table headers, <td> for regular table text). However, if you press Enter at the end of a line, a <p> tag is added within the standard tag. Therefore, in order to keep all of the content in your table cells looking consistent, you may want to create a special style class of the <p> tag to be used for table content (e.g., p.tabletext) and apply that style to all of your cells when you first create a table. You can apply specific styles to tables by selecting the table cells, clicking Table>Cell Content Style, and choosing the style to be used for those cells. See Selecting Styles for Table Cell Contents.

  • Page layout breaks You can set page layout breaks on tables using a couple of different options. In topic style sheets, you can set breaks on the standard HTML table tags. The most common approach is to set breaks on table rows through the <tr> style tag. Another option is that you can set breaks on rows (and on entire tables) through a table style sheet. And because you can create patterns in table style sheets, each pattern item might have different settings for breaks. See Setting Page Layout Breaks on Tables.

  Note: When controlling the look of tables, you should not create and use classes of standard HTML table tags (e.g., a class of the <tr> tag) if you also intend to use table style sheets.

• Tables of contents
  • Heading levels When creating print-based output, you can determine which topic headings will be displayed at which level in the generated TOC. For example, even though all of your topics may use a heading style of <h1>, you might want some of those topic headings to display at the first level in the print TOC (acting as an <h1>), others at the second level (acting as an <h2>), and still others at the third level (acting as an <h3>). See Using Styles for Print TOC Heading Levels.
  • Look For TOCs in print-based output, you can use styles to adjust properties such as font family and size, indentation, word spacing, spacing above/below, TOC width, page number alignment, and leader settings (e.g., the dots between the headings and the numbers). The headings in the print TOC will take on the settings that you specify. You can also modify the look of the entire container holding the generated TOC. See Using Styles to Determine the Look of a Print TOC.

  Note: If you want to change the look of your TOC in online output, you can do so by modifying styles within your skin. See Editing Skin Settings and Specifying Skin Style Settings.

• Text
  • Bold You can apply a bold weight to text. Perhaps the easiest way to do this is to highlight the text and click the Bold button . However, you can also change the properties of a different tag so that it uses a bold weight. See Setting Bold Text.
  • Case You can change the case of text so it is all uppercase or lowercase. You can also specify that the first letter of each word in the selected content should be capitalized, while the other letters are lowercase. See Setting the Case of Text.
  • Color of background You can set a background color for text. See Setting the Background Color for Text.
  • Color of text You can select a color for text. See Setting the Color for Text.
  • Font family You can select a font family (e.g., Arial, Verdana) for text to change its look. See Setting the Font Family for Text.
  • Italics You can apply italics to text. Perhaps the easiest way to do this is to highlight the text and click the Italic button . However, you can also change the properties of a different tag so that it uses italics. See Setting Italic Text.
  • Italic correction You can correct the spacing in a line when italic formatting is involved. Often, when you italicize a word in the middle of a sentence, the last letter of that word has less space between it and the following word (due to the fact that it is italicized and the following word is not). Using italic correction, you can increase this space between the italicized word and the non-italicized word. See Setting Italic Correction.
  • Letter spacing You can specify the amount of spacing between letters in text. See Setting Letter Spacing.
  • Overline You can specify that a horizontal line should be placed above text (opposite of underlined text). See Setting an Overline on Text.
  • Size You can specify the size of text, choosing from many different units of measurement. See Setting the Font Size.
  • Smallcaps You can specify that text should be displayed in all capital letters, but in a small size. See Setting Smallcaps on Text.
  • Strikethrough You can specify that a horizontal line should be added through the middle of the text, providing the effect of content that has been "striked through." See Setting a Strikethrough Effect on Text.
  • Subscript You can apply a subscript effect to topic text, where some text appears below the level of the other characters (e.g., H₂O). Perhaps the easiest way to do this is to highlight the text and then click the Subscript button . However, you can also change the properties of a different tag so that it appears as subscript text. See Setting Subscript Text.
  • Superscript You can apply a superscript effect to text, where some text appears above the regular text (e.g., X²). Perhaps the easiest way to do this is to highlight the text and click the Superscript button . However, you can also change the properties of a different tag so that it appears as superscript text. See Setting Superscript Text.
  • Underline You can easily underline text. See Setting Underlined Text.
  • Word spacing You can specify the amount of spacing between words. See Setting Word Spacing.
• Text boxes
  • Background After you insert a text box, you can add background settings to the text box. This includes the ability to specify a color, an image, and a repeating pattern for the background image. See Adding Backgrounds to Text Boxes.
  • Borders After you insert a text box, you can add borders around it, specifying the border size, color, and type. See Adding Borders to Text Boxes.
  • Hyphenation After you insert a text box, you can adjust the way that the text within it is hyphenated. See Setting Hyphenation in Text Boxes.
  • Margins After you insert a text box, you can adjust the margins around it so that there is extra space above, below, to the right, or to the left of it. See Adding Margins to Text Boxes.
  • Padding After you insert a text box, you can add padding (i.e., extra space) between the text box's border and the text within it. See Adding Padding to Text Boxes.
  • Positioning After you insert a text box, you can adjust its positioning on the page. This includes the ability to float text boxes to the left or right, or even outside of page frames. See Positioning Text Boxes.
  • Size After you insert a text box, you can adjust its width and height. See Specifying the Size of Text Boxes.
• Topics

  • Background You can change the background color for topics by using the <body> style or classes of that style. If you want the background color to be applied to all topics using a particular style sheet, you can use the main <body> style. If you want to change the background color for only some topics, create and use a class of the <body> style. See Applying Color to the Background for Topics.

    You can also add a background image on topics by using the <body> style tag. See Setting a Background Image on Topics.

  • Nonscrolling region For online output you can specify that a certain portion of the content (usually a heading and breadcrumbs, if included) should remain fixed in place. This means that when the end user scrolls down to see more content, the fixed areas do not scroll with the rest of the text. You can see an example of this in any Flare online Help topic. See Creating a Nonscrolling Region.
  • Toolbars You can use the <Madcap|topicToolbarProxy> style to change the look of the container holding the generated toolbar. See Using Styles to Determine the Look of Topic Toolbars.

Following are the basic steps for editing styles in a topic style sheet.

How to edit styles in a topic style sheet

1. Open the topic style sheet that you want to modify.

2. Complete one of the following sets of steps, depending on whether you want to use the Simplified view or Advanced view in the Stylesheet Editor.

   • Simplified The Simplified view is better for new users. It provides an easier way to apply properties to styles, with format options available from a toolbar (similar to the way one would use the Text Format toolbar to change the look topic content without a style). In many cases, only the most common property options are available in the Simplified view (e.g., font, letter/word spacing, paragraph alignment/indentation, auto-numbering format, borders, background). One advantage of the Simplified view is that you can apply a property to multiple styles at the same time. You can also click a check box to hide the properties in the editor, allowing you to see only the styles.
   • Advanced The Advanced view displays style classes and properties in hierarchical tree structures. It is not as quick as using the Simplified view, but it allows you to edit a great deal more settings than are available in the Simplified view.

   Warning: When editing styles, make sure the proper medium is selected in the Stylesheet Editor before you begin (you can do this from the Medium drop-down list). Flare remembers the last medium that you used when working in the style sheet, so it may or may not be the one that you want to use the next time around. If you want all mediums to use the same setting, select the "default" medium and the properties will "trickle down" to the other mediums. If you are not using different mediums, you do not need to worry about selecting one when you edit styles. See About Style Sheet Mediums.

If using the Simplified view:

1. In the local toolbar, make sure the first button displays (which means that the Simplified view is currently shown in the editor). If the button displays instead, then click it.
2. (Optional) You can click in the Show Styles field in the upper-left corner of the Stylesheet Editor to limit which styles are shown in the editor. For example, if you select Show All Styles, then all styles will be displayed. If you select Show Paragraph Styles, only paragraph styles will be displayed. If you select Show Table Styles, only table styles will be displayed.
3. From the grid in the bottom portion of the Stylesheet Editor, select a style.
4. In the local toolbar of the editor, click . The Properties dialog opens.
5. Use the Properties dialog to change values for the style's properties.

   

6. In the Properties dialog, click OK.

If using the Advanced view:

1. In the local toolbar, make sure the first button displays (which means that the Advanced view is currently shown in the editor). If the button displays instead, then click it.
2. (Optional) You can click in the Show Styles drop-down list in the upper-left corner of the Stylesheet Editor to limit which styles are shown in the editor. For example, if you select Show All Styles, then all styles will be displayed. If you select Show Paragraph Styles, then only paragraph styles will be displayed. If you select Show Table Styles, then only table styles will be displayed.

3. In the Styles section of the editor, select the style that you want to edit.

   Note: If you want to limit the list of styles to only those that you tend to use in your project, you can disable the styles that you do not want to see. This does not delete those styles; it merely hides them from view. See Disabling Styles.

4. From the Show Properties drop-down list on the upper-right side of the editor, select any of the options shown to determine which properties are displayed below. This is simply a way to find the appropriate property as quickly as possible.
   • Assorted Relevant Properties Displays the property groups that are used most often for the selected style type.
   • Property Groups Displays all the different groups holding the properties for the selected style. Property groups are simply a way to organize the properties so that they are easy for you to find. If you want to see the values for a given property group, click the plus button next to it.
   • Alphabetical List Displays all of the properties for the selected style in alphabetical order.
   • Set Properties Displays all properties that have been set for the style.
   • Set (Locally) Properties Displays properties that have been set for the selected style directly in one or more topics. In other words, the global setting for that particular style has been overruled in some topics within the project. For more information seeLocal Formatting.



5. In the Properties section, locate the specific property that you want to change.

   The property name is shown in the left column. The right column is used for selecting and entering values for the property.

   

6. Click in the value column on the right side. Depending on the type of property, you can either type the value, select it from a drop-down list, or complete the values in a dialog or popup box.

   If you completed values in a popup, click OK at the bottom of the box.

   

   As you make changes to a property's values, you can see how the changes look in the Preview section at the bottom of the editor.

   

3. Press CTRL+S or click to save your work.

Following are the basic steps for editing styles in a table style sheet.

How to edit styles in a table style sheet

1. Open the table style sheet that you want to edit.
2. In the Table Style Editor, set the options for the table style on the tabs available.
   • General tab This tab lets you set border, padding, margin, page layout breaks, and background properties for the entire table style.
     • Table Margins Click in any of the individual fields (Left, Right, Top, Bottom) to specify the settings for the table margins (the amount of space around the table). In the left side of the field, enter a number for the amount of padding. In the right side of the field, select a unit of measurement (e.g., point, pixel, centimeter) for the number you entered. See About Units of Measurement. If you click the down arrow to the right of all the fields, the settings will be applied to all of the table margin fields. When you click that down arrow, a small popup displays. Use the lower-left area of the popup to enter a number for the amount of margin. Use the lower-right area to select a unit of measurement.
     • Outer Borders Click in any of the individual fields (Left, Right, Top, Bottom) to specify the settings for the table border in the style sheet. If you click the down arrow to the right of all the fields, the settings will be applied to all of the border fields. When you click that down arrow or in one of the individual fields, a small popup displays. Use the lower-left area of the popup to enter a number for the thickness of the border. Use the lower-middle area to select a unit of measurement (e.g., point, pixel, centimeter) for the number you entered. See About Units of Measurement. Use the upper-right area to select a color for the border. And use the lower-right area to select a line type (e.g., solid, double, dashed) for the border. When you are finished, click OK in the small popup.
     • Cell Border Collapse Select whether you want to collapse the cell borders in the style sheet. If you collapse the cell borders, the row and cell borders of a table are joined in a single border. If you do not collapse the cell borders, the row and cell borders of a table are detached.
     • Cell Border Spacing Use this area to increase or decrease the amount of spacing for a cell border.
     • Page layout breaks Click the Advanced button to open the Breaks dialog and set page and column breaks for tables. See Setting Page Layout Breaks on Tables.

     • Background Use this area to specify the settings that you want for the table background.

       

       In the Color field, click the down arrow and select a color from the popup. For advanced color options, select More Colors and use the fields in the Color Picker dialog.

       Next to the Image field, click . Select an image file to insert and click OK.

       If you want the background image to repeat, select one of the options from the Repeat field. You can also set the image position horizontally and vertically by using the X and Y fields.

     • Cell Padding Click in any of the individual fields (Left, Right, Top, Bottom) to specify the settings for the cell padding (the amount of space between the edge of the table cell and the content in the cell). In the left side of the field, enter a number for the amount of padding. In the right side of the field, select a unit of measurement (e.g., point, pixel, centimeter) for the number you entered. See About Units of Measurement. If you click the down arrow to the right of all the fields, the settings will be applied to all of the cell padding fields. When you click that down arrow, a small popup displays. Use the lower-left area of the popup to enter a number for the amount of padding. Use the lower-right area to select a unit of measurement.
   • Rows, Columns, Header, and Footer Tabs These tabs let you set properties for the various elements of the table. For any of these elements, you can add multiple repeatable patterns with different colors and text properties. Following are descriptions for the fields that appear on each tab.

     • Row/Column/Header/Footer Styles Displays the patterns for the row, column, header, or footer in the style sheet. Each line represents a different pattern and how many times it is repeated in a table before the next pattern occurs.

       • Name Displays the name of each pattern. Depending on which tab you are working on, the default names of the patterns may be Body1, Body2, Body3, etc.… Column1, Column2, Column3, etc.… Header1, Header2, Header3, etc.… Footer1, Footer2, Footer3, etc. You can click in the cell, press F2, and enter a custom name for each pattern if you like.

         

       • Type Select a type for the item.

         

         Most of the time you will probably want to use the Pattern type. This means that the settings for that item will be added automatically to any table using that table style sheet. But if an item has a Custom type, its settings will not be added to a table automatically; instead, you would need to apply that item manually to the particular areas of the table where you want to use it. The Custom type might be used if you want a particular style for most of your tables, but there might be some tables where the style needs to be changed somewhat. In those cases, you can manually override the style for those specific tables.

         example

         Let's say you have a table style sheet with three pattern items on the Rows tab (Body1, Body2, Body3), with alternating background colors of blue, yellow, and red, respectively.

         

         However, only the first two items are using the Pattern type. The third item is using the Custom type. Therefore, when you insert a table and use this style sheet, the rows alternate between blue and yellow only.

         

         This particular pattern was created on the Rows tab, which means that it displays only in your body rows, not in any header or footer rows. By right-clicking on the <tbody> tag or any of the <tr> tags within it, you can select Row Style from the context menu. From there, you can select any of the available items in the pattern to override what you already have in the table.

         

         

         

         The only difference between the first two items (Body1 and Body2) and the third item (Body3) is that Body3 can be applied only from this context menu manually. Body1 and Body2 are applied automatically, but can also be applied manually from the context menu too.

       • Repeat Click the up or down numbers to increase or decrease the number of times the pattern occurs in a table before the next pattern is displayed.

         

         example

         Let's say you want to create a pattern for rows. "Body4" means that it is the fourth pattern in the style sheet (although you can give the pattern a custom name, such as "Yellow"). "3 Rows" means that the pattern repeats for three rows in a table before either "Body5" displays (if there is one) or "Body1" starts the cycle over again.

       • Adds a new pattern. The new pattern is initially set to repeat just once, but you can change that in the "Repeat" cell.

       • Removes the selected pattern from the list.

         

       • Moves the selected pattern up in the list.

       • Moves the selected pattern down in the list.

         

     • Height/Width Select a pattern from the section above. Then click this field to open a small popup, which lets you set properties for the height of the row or width of the column. In the lower-left field enter a number. In the lower-right field, select a unit of measurement (e.g., points, pixels, centimeters) for the number you entered. See About Units of Measurement. Then click OK to accept the settings, or click Cancel to close the window without accepting them.

       

       

     • Font Select a pattern from the section above. Then click this field to open a small popup, which lets you set font properties.
     • Weight Select an option to change the weight of the font (e.g., bold). The numbers from 100 to 900 represent different levels of darkness. The number 400 is the same as a "normal" weight, and the number 700 is the same as the standard "bold" option. "Bolder" means the next weight that is assigned to a font that is darker than the inherited one. "Lighter" means the next weight that is assigned to a font that is lighter than the inherited one.

     • Style Select an option to change the style of the font (e.g., italic). According to the World Wide Web Consortium (w3.org):

       The font style specifies whether the text is to be rendered using a normal, italic, or oblique face. Italic is a more cursive companion face to the normal face, but not so cursive as to make it a script face. Oblique is a slanted form of the normal face, and is more commonly used as a companion face to sans-serif. This definition avoids having to label slightly slanted normal faces as oblique, or normal Greek faces as italic.

     • Color Click this field and select a color for the text. For advanced color options, select More colors and use the fields in the Color Picker dialog.
     • Size In the top field, select Length. Then in the lower-left field enter a number for the size of the text, and in the lower-right select a unit of measurement (e.g., points, pixels, centimeters) for the number. See About Units of Measurement.
     • Family Click in this field and select a font family (e.g., Arial) for the text.
     • OK Click this button to accept the settings.
     • Cancel Click this button to close the popup without accepting the settings.
     • Ruler Select a pattern from the section above. Then click this field to open a small popup, which lets you set properties for a ruler (i.e., horizontal line) between the rows or columns in the pattern. In the lower-left field enter a number for the size of the ruler. In the lower-middle field, select a unit of measurement (e.g., points, pixels, centimeters) for the number you entered. See About Units of Measurement. In the upper-right field, select a color for the ruler. In the lower-right field, select a type of line (e.g., solid, double, dashed) for the ruler. Then click OK to accept the settings, or click Cancel to close the window without accepting them.
     • Separator Select a pattern from the section above. Then click this field to open a small popup, which lets you set properties for a separator (i.e., a horizontal line) between the final row or column in the pattern and the first row or column in the next pattern. In the lower-left field enter a number for the size of the separator. In the lower-middle field, select a unit of measurement (e.g., points, pixels, centimeters) for the number you entered. See About Units of Measurement. In the upper-right field, select a color for the separator. In the lower-right field, select a type of line (e.g., solid, double, dashed) for the separator. Then click OK to accept the settings, or click Cancel to close the window without accepting them.
     • Alignment Select an option for aligning text in the row or column horizontally.
     • Left The text aligns at the left edge of each cell.
     • Center The text aligns in the center of each cell.
     • Right The text aligns at the right edge of each cell.
     • Justify The text aligns both at the left and right edges of each cell.
     • Vertical Alignment Select an option for aligning text in the row or column vertically.
     • Top The text aligns at the top of each cell.
     • Middle The text aligns in the middle of each cell.
     • Bottom The text aligns at the bottom of each cell.
     • Page layout breaks (Rows only) Click the Advanced button to open the Breaks dialog and set page and column breaks for table row elements. See Setting Page Layout Breaks on Tables.

     • Background Use this area to specify the settings that you want for the background.

       In the Color field, click the down arrow and select a color from the popup. For advanced color options, select More Colors and use the fields in the Color Picker dialog.

       Next to the Image field, click . Select an image file to insert and click OK.

       If you want the background image to repeat, select one of the options from the Repeat field. You can also set the image position horizontally and vertically by using the X and Y fields.

     • Cell Padding Click in any of the individual fields (Left, Right, Top, Bottom) to specify the settings for the cell padding (the amount of space between the edge of the table cell and the content in the cell). In the left side of the field, enter a number for the amount of padding. In the right side of the field, select a unit of measurement (e.g., point, pixel, centimeter) for the number you entered. See About Units of Measurement. If you click the down arrow to the right of all the fields, the settings will be applied to all of the cell padding fields. When you click that down arrow, a small popup displays. Use the lower-left area of the popup to enter a number for the amount of padding. Use the lower-right area to select a unit of measurement.

     Pattern Example:

     Let's say you want the rows in the table to alternate between having no background color and a green background color. In addition, you want a header row to have a blue background. To do this, you would complete the following steps:

     1. Select the Row tab.
     2. In the Row Styles section, click . Now there should be two patterns (Body1 and Body2).
     3. To make the patterns more identifiable, click in the Body1 cell and press F2. Then type NoColor.
     4. Click in the Body2 cell and press F2. Then type Green.
     5. The Type cell should already be set to "Pattern" for each, and the Repeat cell should already be set to "1" for each. Leave them set that way.
     6. Select the Green pattern row.
     7. In the Background/Color field, select a green color.
     8. Select the Header tab.
     9. Click in the Header1 cell and press F2. Then type Blue.
     10. In the Background/Color field, select a blue color.

The Preview section at the bottom of the editor lets you see how the table elements look as you make changes.





3. Press CTRL+S or click to save your work.