HTML ul bullet li Tag for Unordered List

HTML li tag is placed inside the HTML ul tag for rendering the list items for HTML unordered bulleted lists. In the previous article about HTML ul tag for unordered list, we discussed about the type attribute of HTML ul tag. Type attribute defines the style of bullet associated with HTML unordered list. Type attribute of ul tag accepts 3 values as circle, disc and square. Here we will discuss about the HTML li tag along with its attribute similar to the attributes of <ul> tag. HTML li tag is also used as paired tag <li> and </li> inside the <ul> and </ul> tag to generate a bullet list item.

Example code for HTML ul and li tag

<ul>
    <li>item 1</li>
</ul>

HTML li tag Attributes

HTML li tag has 1 attribute associated with HTML unordered list ul tag and 2nd attribute is associated with HTML ol tag:

1. type: type attribute of HTML li tag also accepts values for bullet style as circle, square and disc. li tag also accepts values for Arabic Numbers, Letters and Roman Numerals as 1, a, A, i and I. This attribute changes the type of bullet or type of numbering in front of list item where ever type attribute is used in the li tags of HTML unordered or ordered list.

2. value: value attribute of HTML li tag changes consecutive numbering order of HTML ordered list only. For example if you will set the value of value attribute as 10 for the second li tag, then it will display number 10 just after the first list item starting with value 1. Actually it changes the starting point of ordered list where value attribute is defined for HTML li tag. Learn more about this attribute here… HTML li Tag for Ordered List Items

Example of HTML li tag using type attribute

<ul>
    <li type="circle">Circle bullet style</li>
    <li type="disc">Disc bullet style</li>
    <li type="square">Square bullet style</li>
</ul>

Continue to next tutorial: HTML Nested ul Unordered List Bullets to learn the nesting of HTML unordered ul list tags.