OBINTUSACADEMY
HOME CONTACT SERVICES PRIVACY
C.B MS-PACKAGES HTML
HTML - Lists

HTML

BASIC

Introduction to HTML Getting Started Basic Structure HTML Syntax HTML Tags HTML Elements HTML Attributes HTML Formatting HTML Links HTML Quotation Element HTML Citation Element HTML Address Element HTML Abbreviation Element HTML Bi-Directional Element HTML Comments HTML Lists HTML Styles HTML Images HTML Favicon Basic Projects

INTERMEDIATE

HTML Meta Tag Attributes HTML Tables HTML Forms HTML Form Elements HTML Form Attributes HTML Input Attributes HTML Form Examples HTML Inline Elements HTML Block Elements HTML Div HTML Id HTML Class HTML iFrame

ADVANCE

HTML Graphics

HTML Lists

PREVIOUS NEXT

HTML lists are used to group connected information (items, names, etc) in a particular way. The three (3) types of lists in HTML are: Ordered, Unordered and Description lists.

Ordered Lists

Ordered lists are used to group connected information in a particular order.

  • Entire lists are enclosed inside <ol>.....</ol> tags
  • Individual list item is enclosed inside <li>.....</li> tags.
  • There are five (5) ordered list type: numbers (1, 2), capital letters (A, B), small letters (a, b), capital roman numerals (i, ii) and small roman numerals (I, II).
  • <ol> accepts type attribute which is used to specify the list type. Example: type="A"

DEFAULT (NUMBERS)

The default list type for ordered list is numbers; whether you specify the attribute type="1" inside the opening <ol> tag or not.

TRY IT OUT YOURSELF

CAPITAL LETTERS

The attribute type="A" is written inside the opening <ol> tag.

TRY IT OUT YOURSELF

SMALL LETTERS

The attribute type="a" is written inside the opening <ol> tag.

TRY IT OUT YOURSELF

CAPITAL ROMAN NUMERALS

The attribute type="I" is written inside the opening <ol> tag.

TRY IT OUT YOURSELF

SMALL ROMAN NUMERALS

The attribute type="i" is written inside the opening <ol> tag.

TRY IT OUT YOURSELF
tips
TIP:

List type can be specified using any of the CSS styling methods. The property for styling this is list-style-type.


Unordered Lists

Unordered lists are used to group connected information in no particular order.

  • Entire lists are enclosed inside <ul>.....</ul> tags
  • Individual list item is enclosed inside <li>.....</li> tags.
  • There are five (3) unordered list type: disc, square and circle.
  • <ul> accepts type attribute which is used to specify the list type. Example: type="disc"

DEFAULT (DISC)

The default list type for unordered list is disc; whether you specify the attribute type="disc" inside the opening <ol> tag or not.

TRY IT OUT YOURSELF

SQUARE

The attribute type="square" is written inside the opening <ul> tag.

TRY IT OUT YOURSELF

CIRCLE

The attribute type="circle" is written inside the opening <ul> tag.

TRY IT OUT YOURSELF

Description Lists

Description lists are used to group connected information and their descriptions.

  • Entire lists are enclosed inside <dl>.....</dl> tags
  • Description term for the list item is enclosed inside <dt>.....</dt> tags.
  • Description list are enclosed inside <dl>.....</dl> tags.
TRY IT OUT YOURSELF
note
NOTE:

These lists can also be called:
Ordered lists - Numbered lists
Unordered lists - Bulleted lists
Description lists - Definition lists


Nested Lists

Nested list is a list inside another list.

TRY IT OUT YOURSELF
PREVIOUS NEXT
ADVERTISEMENTS

LEARNING IS A CONTINOUS PROCESS - PRACTICE MAKES PERFECT