HTML and CSS Reference
In-Depth Information
The difference between the default value
outside
and setting the property to
inside
is
illustrated clearly here:
Examples
ol {list-style-type: upper-roman; list-style-position: outside;
background: yellow;}
ul {list-style-type: square; list-style-position: inside;
background: yellow;}
Compatibility
CSS 1, 2, 3
IE 4+
Netscape 6+, Firefox 1+
Opera 4+, Safari 1+
list-style-type
This property defines labels for a list of items.
Syntax
list-style-type
:
disc | circle | square | decimal | decimal-leading-zero |
lower-roman | upper-roman | lower-greek | lower-latin |
upper-latin | armenian | georgian | lower-alpha |
upper-alpha | none | inherit
The value
none
prevents a list label from displaying. CSS1 defines
disc
,
circle
, and
square
, which are typically used on unordered lists (
<ul>
). The values
decimal
,
lower-
roman
,
upper-roman
,
lower-alpha
, and
upper-alpha
are typically used on ordered lists
(
<ol>
). These property types correspond to the (X)HTML
type
attributes for lists. CSS2
adds more values, primarily for ordered lists in foreign languages.
Examples
ol {list-style-type: upper-roman;}
ol.none {list-style-type: none;}
.ichi-ni {list-style-type: hiragana;}
Compatibility
CSS 1, 2, 3 IE 4+ (partial), IE 8+ Netscape 4+, Firefox 1+ Opera 4+, Safari 1+