Skip to content
Related Articles

Related Articles

Improve Article

HTML | <li> type Attribute

  • Last Updated : 25 Jul, 2019

The <li> type attribute in HTML is used to specify the type of a list items. This attribute also defines the style of the bullet point of the list items.

Syntax:

<li type="1|a|A|i|I|disc|circle|square">

Attribute Values:
For ordered list items:

  • 1: It is the default value. It is used to specify the numerical ordered list.
  • a: It arranged the list items in lower case letters.
  • A: It arrange the list items in the form of upper case.
  • i: It arrange the list items in the roman numbers in the form of lower case letters.
  • I: It arranged the list in roman numerals in the form of uppercase letters.

For unordered list items:

  • disc: It is the default value. It cretes a filled circle.
  • circle: It creates an unfilled circle.
  • square: It creates an filled square.

Note: The <li> type attribute is not supported by HTML 5.



Example 1:




<!DOCTYPE html> 
<html
  
<head
    <title
        HTML li type Attribute 
    </title
</head
      
<body
      
    <h1 style = "color: green;"
        GeeksforGeeks 
    </h1
              
    <h2
        HTML list item type Attribute 
    </h2
              
    <p>Sorting Algorithms</p
          
    <ol
        <li type="a">Merge sort</li
        <li>Quick sort</li
        <li type="I">Insertion sort</li
    </ol
</body
  
</html>                    

Output:

Example 2:




<!DOCTYPE html> 
<html
  
<head
    <title
        HTML li type Attribute 
    </title
</head
      
<body
      
    <h1 style = "color: green;"
        GeeksforGeeks 
    </h1
              
    <h2
        HTML li type Attribute 
    </h2
              
    <p>Sorting Algorithms</p
          
    <ul
        <li>Merge sort</li
        <li>Quick sort</li
        <li type="square">Insertion sort</li
    </ul
</body
  
</html>                    

Output:

Supported Browsers: The browser supported by HTML <li> type attribute are listed below:

  • Google Chrome
  • Internet Explorer
  • Firefox
  • Safari
  • Opera

Attention reader! Don’t stop learning now. Get hold of all the important Comcompetitivepetitve Programming concepts with the Web Design for Beginners | HTML  course.




My Personal Notes arrow_drop_up
Recommended Articles
Page :