CSS Classification Properties

Css

Show

Syntax: Display: < value >

Allow Value: Block | inline | List-item | None

Initial value: Block

Apply to: All objects

Backward compatible: No

Display properties allow one of the four values to be used to define an element:

Block (there will be a newline before and after the element)
Inline (no line wrapping before and after the element)
List-item (same as block, but with added catalog entry tag)
None (not shown)
Each element is typically given a default display value by the browser based on the suggested presentation of HTML specifications.

The display property may not be safe because it displays the element in another inappropriate format. Using a value of none closes the display of the specified element and its child elements!

Blank

Syntax: White-space: < value >

Allow Value: normal | Pre | NoWrap

Initial value: Normal

Apply to: block-level elements

Backward-compatible: Yes

A blank property determines how spaces within an element are handled. The value of this property takes one of the following three:

Normal (fold multiple spaces into one)
Pre (no folding spaces)
NoWrap (no line wrapping is allowed unless a <BR> tag is encountered)

Directory Style Type

Syntax: List-style-type: < value >

Allowable Value: Disc | Circle | Square | decimal | Lower-roman | Upper-roman | Lower-alpha | Upper-alpha | None

Initial value: Disc

Applies To: A table item element with a display value

Backward-compatible: Yes

The Catalog Style Item property specifies the type of the catalog item tag, used when the catalog style image value is None or when the image load option is turned off.

For example:

Li.square {List-style-type:square}
Ul.plain {List-style-type:none}
OL {List-style-type:upper-alpha}/* A B C D E etc. * *
Ol ol {List-style-type:decimal}/* 1 2 3 4 5 etc. * *
Ol ol ol {List-style-type:lower-roman}/* I II III IV v etc. *

Catalog Style image

Syntax: List-style-image: < value >

Allowable Value: <url> | None

Initial value: None

Applies To: A table item element with a display value

Backward-compatible: Yes

When the image load option is open, the Catalog Style image property uses the image in the specified directory item tag to replace the tag specified by the catalog style type attribute.

For example:

Ul.check {List-style-image:url (/li-markers/checkmark.gif)}
UL li.x {list-style-image:url (x.png)}

TOC Style Location

Syntax: list-style-position: < value >

Allowable Value: Inside | Outside

Initial value: Outside

Applies To: A table item element with a display value

Backward-compatible: Yes

The Directory Style Location property can be value inside (internal) or outside (external), where outside is the default value. The entire property determines where the tag for the catalog entry should be placed. If you use the inside value, the line is moved under the tag instead of indented. Examples of applications are as follows:

Outside Rendering:
* List Item 1
Second line of list item

Inside Rendering:
* List Item 1
Second line of list item

TOC Styles

Syntax: List-style: < value >

Allowable values: < Directory style Type > | | < directory style location > | | <url>

Initial value: Not defined

Applies To: A table item element with a display value
Backward-compatible: Yes

The directory style properties are the directory style type, the directory style location, and the outline of the catalog style image properties.

For example:

Li.square {List-style:square Inside}
Ul.plain {List-style:none}
Ul.check {list-style:url (/li-markers/checkmark.gif) Circle}
OL {List-style:upper-alpha}
Ol ol {List-style:lower-roman inside}