HTML Lists
From w3cyberlearnings
Contents |
HTML - <ul> and <ol>
Create order list with <ol> and create un-order list with <ul>.
HTML - Syntax <ul> and <ol>
// un order list <ul> <li> list 1</li> <li> list a</li> <li> list c</li> <li> list d</li> </ul> // order list <ol> <li> list 1</li> <li> list a</li> <li> list c</li> <li> list d</li> </ol>
Note
Some of the information is obsoleted and you may want to use CSS.
Example - Attributes for un-order list
| Attributes | Value | Example | Description |
|---|---|---|---|
| type | square | <ul type="square">...</ul> | Render a list with square bullet type |
| type | disc | <ul type="disc">...</ul> | Render a list with disc bullet type |
| type | circle | <ul type="circle">...</ul> | Render a list with circle bullet type |
Example - Attributes for order list
| Attributes | Value | Example | Description |
|---|---|---|---|
| type | a | <ol type="a">...</ol> | Render a list with letter lowercase a bullet type |
| type | A | <ol type="A">...</ol> | Render a list with uppercase A bullet type |
| type | i | <ol type="i">...</ol> | Render a list with lowercase Roman numer bullet type |
| type | I | <ol type="I">...</ol> | Render a list with uppercase Roman numer bullet type |
| start | number | <ol start="8">...</ol> | Render a list with an initial starting number |
Example 1
<html> <head> <title> list</title> </head> <body> <ol> <li>Apple</li> <li>Banana</li> <li>Mango</li> </ol> <ol type="A"> <li>Apple</li> <li>Banana</li> <li>Mango</li> </ol> <ol type="i"> <li>Apple</li> <li>Banana</li> <li>Mango</li> </ol> <ol start="8"> <li>Apple</li> <li>Banana</li> <li>Mango</li> </ol> <ul> <li>Apple</li> <li>Banana</li> <li>Mango</li> </ul> </body> </html>
Related Link
- HTML - pre
- HTML - Lists
- HTML - Formatting
- HTML - Fonts
- HTML - Block
