Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Oppiskele Lists | Basic Elements
Introduction to HTML

book
Lists

In HTML, there are three types of lists: ordered, unordered, and descriptive.

Ordered List and Unordered List

An ordered list is a list of items numbered, whereas an unordered list is a list of items marked with bullet points.

html

index.html

copy
<ol>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>

Here is an example of an unordered list:

html

index.html

copy
<ul>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ul>

This would create a bullet-pointed list with the items 'First item', 'Second item', and 'Third item'.

Both the <ol> and <ul> elements can be used with the type attribute to specify the numbering or bullet point style.

For example, you could use the type attribute to create a list with lowercase letters instead of numbers, like this:

html

index.html

copy
<ol type = 'a'>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>

The <li> element can be used with the value attribute to specify the numbering or bullet point style for a specific item in the list.

html

index.html

copy
<ol>
<li value="1">First item</li>
<li value="5">Second item</li>
<li value="10">Third item</li>
</ol>

Descriptive list

A description or definition list lists terms and their corresponding descriptions.

html

index.html

copy
<dl>
<dt>Term 1</dt>
<dd>Description of term 1</dd>
<dt>Term 2</dt>
<dd>Description of term 2</dd>
<dt>Term 3</dt>
<dd>Description of term 3</dd>
</dl>

The <dl> element is used to define the description list, and the <dt> and <dd> elements are used to determine the terms and descriptions, respectively.

Here is an example of a description list with multiple descriptions for a single term:

html

index.html

copy
<dl>
<dt>Term 1</dt>
<dd>Description of term 1</dd>
<dd>Another description of term 1</dd>
<dd>Yet another description of term 1</dd>
<dt>Term 2</dt>
<dd>Description of term 2</dd>
<dt>Term 3</dt>
<dd>Description of term 3</dd>
</dl>
question mark

What is the correct HTML tag for creating a term in a descriptive list?

Select the correct answer

Oliko kaikki selvää?

Miten voimme parantaa sitä?

Kiitos palautteestasi!

Osio 2. Luku 6

Kysy tekoälyä

expand
ChatGPT

Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme

some-alt