Unordered List
- Unordered lists are used to group the set of unrelated items.
- items in the unordered list are marked with bullets, also called a bulleted list.
- It starts with the <ul> tag, and list items begin with the <li> tag
Syntax:
<ul>
<li>line1</li>
<li>Line2</li>
<li>Line3</li>
</ul>
Example:
<!DOCTYPE html>
<html>
<head>
<title>Unordered list</title>
</head>
<body>
<h3>Unordered list example</h3>
<ul>
<li>Cat</li>
<li>Dog</li>
<li>Cow</li>
</ul>
</body>
</html>
Output:
The type Attribute in Unordered Lists
Value | Description |
---|---|
disc | Sets the list item marker to a bullet (default) |
circle | Sets the list item marker to a circle |
square | Sets the list item marker to a square |
none | The list items will not be marked |
disc
- The type="disc" attribute specifies the list item marker to a bullet (default)
Example:
<!DOCTYPE html>
<html>
<head>
<title>Unordered list</title>
</head>
<body>
<h3>Unordered list example</h3>
<ul type="disc">
<li>Cat</li>
<li>Dog</li>
<li>Cow</li>
</ul>
</body>
</html>
Output:
Circle
- The type="circle" attribute specifies the list item marker to a circle.
Example:
<!DOCTYPE html>
<html>
<head>
<title>Unordered list</title>
</head>
<body>
<h3>Unordered list example</h3>
<ul type="circle">
<li>Cat</li>
<li>Dog</li>
<li>Cow</li>
</ul>
</body>
</html>
Output:
Square
- The type="disc" attribute specifies the list item marker to a square
Example:
<!DOCTYPE html>
<html>
<head>
<title>Unordered list</title>
</head>
<body>
<h3>Unordered list example</h3>
<ul type="square">
<li>Cat</li>
<li>Dog</li>
<li>Cow</li>
</ul>
</body>
</html>
Output: