Ordered lists and numbered. Unordered lists are 'bulleted'. Ordered lists can use a number of different numbering systems. Unordered lists can use a number of different 'bullets'. The number or the 'bullet' can be inside the list or outside,
Bullet types for <UL>
- None
- Square
- Circle
- Solid Disc (default)
|
Number styles for <OL>
- decimal
- decimal-leading-zero
- lower-roman
- upper-roman
- lower-greek
- lower-alpha
- upper-alpha
- hebrew
| List 'bullets' and numbers can be inside or outside
Inside
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Forsaking monastic tradition, twelve jovial friars gave up their vocation
- The sex life of the woodchuck is a provocative question for most
- Whenever the black fox jumped the squirrel gazed suspiciously.
| |
Outside
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- Forsaking monastic tradition, twelve jovial friars gave up their vocation
- The sex life of the woodchuck is a provocative question for most
- Whenever the black fox jumped the squirrel gazed suspiciously.
|
|
The list-style property is specified as one, two, or three keywords in any order If list-style-type
and list-style-image
are both set, then list-style-type
is used as a fallback if the image is unavailable. The property applies to <ul>,<ol>
, and <li>
, and can all be set with one statement: list-style
which is a shorthand for the following CSS properties:
list-style-image
none or a url to an image, default=none
list-style-position
which can be inside
or outside
, default is outside
list-style-type
which can be disc, circle, square
for unordered lists and a large number of numerals in various languages are available, default is Latin ASCII numerals.
Examples:
list-style
Syntax
/* type */
list-style: square;
/* image */
list-style: url("../img/shape.png");
/* position */
list-style: inside;
/* type | position */
list-style: georgian inside;
/* type | image | position */
list-style: lower-roman url("../img/shape.png") outside;
Default is
list-style: disc outside none;