List

Bulleted List

To create a bulleted list you need to add a <u> and a </u> tag at the beginning and the end of the list.

N umbered lists have <ol> tags instead of <ul> tags.

To separate single list items use <li> and </li> tags.

There are special settings that you can use to customize the lists on your page.

The following example shows a bullet list with three items.

LOOKS LIKE THIS:

• first text
• second text
• third text

code:

<ul>
<li>first text</li>
<li>second text</li>
<li>third text</li>
</ul>

following bullet options:

• disc
• circle
• square

Makes a bulleted list using the default bullet type:

<ul type="disc">	Starts a bulleted list using discs as bullets: First text Second text
<ul type="circle">	Starts a bulleted list using circles as bullets: First text Second text
<ul type="square">	Starts a bulleted list using squares as bullets: First text Second text

Numbered List

Shows how to make different kinds of numbered lists.

You have the following number options:

• Plain numbers
• Capital Letters
• Small Letters
• Capital Roman Numbers
• Small Roman Numbers

In addition to these options you can specify at which number the list should start. The default start value for numbered lists is at number one (or the letter A).

Makes a numbered list using the default number type:

LOOKS LIKE THIS:

1. text
2. text
3. text

code:

<ol>
<li>first text</li>
<li>second text</li>
<li>third text</li>
</ol>

examples to see the detailed syntax.

<ol start="5">	Starts a numbered list, first # being 5. First text Second text
<ol type="A">	Starts a numbered list, using capital letters. First text Second text
<ol type="a">	Starts a numbered list, using small letters. First text Second text
<ol type="I">	Starts a numbered list, using capital roman numbers. First text Second text
<ol type="i">	Starts a numbered list, using small roman numbers. First text Second text
<ol type="1">	Starts a numbered list, using normal numbers. First text Second text
<ol type="I" start="7">	An example of how type and start can be combined. First text Second text

tricks

Style Image

• List item two
• List item two
• List item two

code:

<ul style="list-style-image: url(IMAGE URL);">
<li>first text</li>
<li>second text</li>
<li>third text</li>
</ul>

NESTED LISTS

1. List Item 1
1. first text
2. second txt
2. List Item 2
• first text

code:

<ol type="1">
<li>List Item 1</li>
<ol type="a">
<li>first text</li>
<li>second text</li>
</ol>
<li>List Item 2</li>
<ul>
<li>first text</li>
</ul>
</ol>

ORDERED<li>TYPES

1. text
2. text
3. text
4. text
5. text

code:

<ol>
<li type="A">text</li>
<li type="a"> text</li>
<li type="I">text</li>
<li type="i">text</li>
<li type="1">text</li>
</ol>

TYPE:

• first text
• second text
• third text

code:

<ul>
<li type="disc">first text</li>
<li type="circle">second text</li>
<li type="square">third text</li>
</ul>