Unordered Lists
Unordered lists in HTML are used to display a list of items that do not have a specific order. They are typically displayed with bullets, but the style of the bullets can be customized using CSS.
The <ul>
element is used to define an unordered list. Each item in the list is defined by a <li>
element.
Here is an example of an unordered list:
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
Task
Add an unordered list ul with 3 items il: HTML, CSS, JavaScript after the Skills heading within the section element. Run the code to see the results and experiment with the code to get used to it.
The <ul>
element has a few attributes that can be used to customize the list. The type
attribute can be used to specify the type of bullets that are used. The possible values for the type
attribute are disc
, circle
, and square
.
The <ul>
element can also be nested. This means that you can create a list of lists.
Here is an example of a nested unordered list:
<ul>
<li>Item 1
<ul>
<li>Item 1.1</li>
<li>Item 1.2</li>
</ul>
</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
This will display a list with three items. The first item has a nested list with two items.
Example
Here is an example of an HTML document that uses an unordered list:
<!DOCTYPE html>
<html>
<head>
<title>Unordered List Example</title>
</head>
<body>
<h1>Unordered List Example</h1>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
</body>
</html>
This document defines an unordered list with three items. The list is displayed with bullets.
To run this code, you can save it as a .html
file and open it in a web browser.