Font family

Syntax:

font-family:font1,font2,fontn;

Possible values:

Any font name.

Example:

font-family:arial,verdana;

Font size

Syntax:

font-size:value;

Possible values:

--pt | --pc | --px | --in | --cm | --mm

xx-small | x-small | small | medium | large | x-large | xx-large

Example:

font-size:12px;

Font style

Syntax:

font-style:value;

Possible values:

normal | italic

Example:

font-style:italic;

Font weight

Syntax:

font-weight:value;

Possible values:

normal | bold

Example:

font-weight:bold;

Background

Syntax:

background: value;

Possible values:

color | transparent

Determine a color value using one of the following syntaxes: #0000ff, black, rgb(50%,60%,80%)

Example:

background:#0000ff;

Background attachment

Syntax:

background-attachment:value;

Possible values:

fixed | scroll

Determine the scrolling behaviour of a background image.

Example:

background-image:url(background.jpg);
background-repeat:repeat-y;
background-attachment:fixed;

Background color

Syntax:

background-color:value;

Possible values:

color | transparent

Determine a color value using one of the following syntaxes: #0000ff, black, rgb(50%,60%,80%)

Example:

background-color:#0000ff;

Background image

Syntax:

background-image:url(URI);

Possible values:

url(URI)

Determine an absolute or relative URL value for the image file (GIF / JPG / JPEG / PNG) which should be display in the background.

Example:

background-image:
url(http://myserver.com/images/background.gif);

Background repeat

Syntax:

background-repeat:value;

Possible values:

repeat | repeat-x | repeat-y | no-repeat

Determine the repetition of an image (set by background-image) in background.

Example:

background-image:url(background.jpg);
background-repeat:repeat-y;

Color

Syntax:

background:value;

Possible values:

color

Determine a color value using one of the following syntaxes: #0000ff, black, rgb(50%,60%,80%)

Example:

color:#0000ff;

Text alignment

Syntax:

text-align:value;

Possible values:

left | right | center

Example:

text-align:center;

Text decoration

Syntax:

text-decoration:value;

Possible values:

none | underline | line-through

Example:

text-decoration:line-through;

Vertical alignment

Syntax:

vertical-align:value;

Possible values:

sub | super | baseline

Example:

vertical-align:sub;

Bottom margin

Syntax:

margin-bottom:value;

Possible values:

--pt | --pc | --px | --in | --cm | --mm

Example:

margin-bottom:12pt;

Top margin

Syntax:

margin-top:value;

Possible values:

--pt | --pc | --px | --in | --cm | --mm

Example:

margin-top:12pt;

Left margin

Syntax:

margin-left:value;

Possible values:

--pt | --pc | --px | --in | --cm | --mm

Example:

margin-left:12pt;

Right margin

Syntax:

margin-right:value;

Possible values:

--pt | --pc | --px | --in | --cm | --mm

Example:

margin-right:12pt;

List style

Syntax:

list-style-type:value;

Possible values:

disc | circle | square | decimal | lower-alpha | uppper-alpha

Example:

list-style-type: disc;

List style image

Syntax:

list-style-image: url(value);

Example:

ul { list-style-type:none; list-style-image:url(icon.gif); }

Table width

Syntax:

width:value;

Possible values:

--px | --%

Example:

width:100%;

Border color

Syntax:

border-color:value;

Possible values:

color

Determine a color value using one of the following syntaxes: #0000ff, black, rgb(50%,60%,80%)

Example:

border-color:#0000ff;

Border width

Syntax:

border-width:value;

Possible values:

--px | --%

Example:

border-width:100%;

Read-only content

Syntax:

ro-readonlycontent:value;

Possible values:

true|false

Description:

The content of the elements this style is applied to will become read-only, i.e. it can not be edited or modified. The corresponding elements still can be deleted.

Example:

ro-readonlycontent:true;

Read-only element

Syntax:

ro-readonlyelement:value;

Possible values:

true|false

Description:

The elements this style is applied to will become read-only, i.e. they can not be edited or modified.

Example:

ro-readonlyelement:true;

Content Limit

Syntax:

ro-contentlimit:value;

Possible values:

Any integer value.

Description:

This element can only contain up to value characters. Entering more characters than specified by value in this element is not possible.

Example:

ro-contentlimit:100;

Read-only element

Syntax:

ro-readonlyelement:value;

Possible values:

true|false

Description:

The elements this style is applied to will become read-only, i.e. they can not be edited or modified.

Example:

ro-readonlyelement:true;

Formatting Only

Syntax:

ro-formattingonly:value;

Possible values:

(true|false)

Description:

The content of this element can not be modified as with ro-readonlycontent . The formatting of the element however can still be modified when this property is set.

Note

This property will not have an effect if ro-readonlycontent is set to true for the same element.

Example:

mytag {
    ro-readonlycontent:false;
    ro-formattingonly:true;
}

Always show element

Syntax:

ro-alwaysshowtags:value;

Possible values:

true|false

Description:

The custom element this style is applied to is always displayed. Normally custom elements are only displayed while the "SHOWNALLCHAR" mode is active.

Example:

ro-alwaysshowtags:true;

Start tag icon

Syntax:

ro-starttagicon:value;

Possible values:

URL pointing to the location of an icon file (possible formats: GIF, JPG and PNG). May be relative to the editor's codebase.

Description:

The editor will use the icon indicated by value to display the opening tag of the elements this style is applied to.

Note:

The element is only displayed if the "SHOWNALLCHAR" mode is active or if the style ro-alwaysshowtags is applied to this element.

Example:

ro-starttagicon:"icons/start.gif";

End tag icon

Syntax:

ro-endtagicon:value;

Possible values:

URL pointing to the location of an icon file (possible formats: GIF, JPG and PNG). May be relative to the editor's codebase.

Description:

The editor will use the icon indicated by value to display the closing tag of the element this style is applied to.

Note:

The element is only displayed if the "SHOWNALLCHAR" mode is active or if the style ro-alwaysshowtags is applied to this element.

Example:

ro-endtagicon:"icons/end.gif";

Maximum width of custom element representation

Syntax:

ro-maxiconwidth:value;

Possible values:

--pt | --pc | --px | --in | --cm | --mm

Description:

The editor will use this value to determine the maximum width of the generated custom element representation this style is applied to.

Note:

The style is only taken into consideration if no custom icon is specified for the custom element using ro-starttagicon and ro-endtagicon .

Example:

ro-maxiconwidth:100px;

Start tag label

Syntax:

ro-starttaglabel:value;

Description:

The editor will use the value indicated as label for the opening of the custom element this style is applied to. You can use the keyword attr to select an attribute the style applies to. The value of this attribute will then be used as label for the tag. You can freely combine attribute values and text strings in this way.

Important:

The style is only taken into consideration if no custom icon is specified for the custom element using ro-starttagicon and ro-endtagicon .

Example:

ro-starttaglabel:"start label" attr(nameofanttribute);

End tag label

Syntax:

ro-endtaglabel:value;

Description:

The editor will use the value indicated as label for the closing of the custom element this style is applied to. You can use the keyword attr to select an attribute the style applies to. The value of this attribute will then be used as label for the tag. You can freely combine attribute values and text strings in this way.

Important:

The style is only taken into consideration if no custom icon is specified for the custom element using ro-starttagicon and ro-endtagicon .

Example:

ro-endtaglabel:"end label: " attr(nameofanttribute);

Hide Class

Syntax:

ro-hideclass:value;

Possible values:

true|false

Description:

If this property is set to false, it is not possible to select or apply the CSS class it is defined for in any of the editor's dialogs.

Example:

.redarea {
    ro-hideclass: true;
    color: red;
}

Class Description

Syntax:

ro-classdescription:value;

Description:

The value of this property determines the name which will be used to display the class it is defined for in the editor's dialogs. For example, if it is set to "Red Text", then the string "Red Text" will be displayed in dialogs such as the style selector combo box instead of the class name itself.

Example:

.redarea {
    ro-classdescription: "Red Text";
    color: red;
}

Balloon Width

Syntax:

ro-balloon-width:value;

Description:

The value of this property determines the width of the balloons that display changes in comparison mode.

Example:

* {
    ro-balloon-width: 200px;
}

Balloon Color

Syntax:

ro-balloon-color:value;

Description:

The value of this property determines the color of the balloons that display changes in comparison mode.

Example:

* {
    ro-balloon-color: #0689cc;
}

Selected Balloon Color

Syntax:

ro-balloonselected-width:value;

Description:

The value of this property determines the width of selected balloons in comparison mode.

Example:

* {
    ro-balloonselected-width: #0689cc;
}

Selected Balloon Color

Syntax:

ro-balloonselected-color:value;

Description:

The value of this property determines the color of selected balloons in comparison mode.

Example:

* {
    ro-balloonselected-color: #0689cc;
}