The type Attribute Explanation with Examples

[akhilpoojari]

The "type" attribute in HTML is used to specify the type of marker or numbering style used in ordered lists (`<ol>`). It allows you to customize the appearance of the list markers, such as using different types of numbers, letters, or symbols. The "type" attribute can take several values to define the desired numbering or marker style.

Here's an explanation of how to use the "type" attribute with examples:

Syntax:

<ol type="value">
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
<!-- More list items if needed -->
</ol>

Example 1: Using Decimal Numbers (Default)

<ol type="1">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>

Output:
1. Item 1
2. Item 2
3. Item 3

Example 2: Using Lowercase Alphabetical Characters

<ol type="a">
<li>Item a</li>
<li>Item b</li>
<li>Item c</li>
</ol>

Output:
a. Item a
b. Item b
c. Item c

Example 3: Using Uppercase Alphabetical Characters

<ol type="A">
<li>Item A</li>
<li>Item B</li>
<li>Item C</li>
</ol>

Output:
A. Item A
B. Item B
C. Item C

Example 4: Using Roman Numerals (Lowercase)
<ol type="i">
<li>Item i</li>
<li>Item ii</li>
<li>Item iii</li>
</ol>

Output:
i. Item i
ii. Item ii
iii. Item iii

Example 5: Using Roman Numerals (Uppercase)
<ol type="I">
<li>Item I</li>
<li>Item II</li>
<li>Item III</li>
</ol>
Output:
I. Item I
II. Item II
III. Item III

Example 6: Using Custom Marker Symbols (HTML Entities)
<ol type="circle">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>
Output:
◦ Item 1
◦ Item 2
◦ Item 3

Notes:
- The "type" attribute is optional. If not specified, the default type is decimal numbering (type="1").
- The supported values for the "type" attribute include "1", "a", "A", "i", "I", "circle", "disc", and "square". Each value represents a different list marker style.
- The appearance of the markers may vary slightly depending on the browser and the user's settings, especially for custom marker symbols.