#HTML
#ol, ul, dl
#sorted list, unsorted list, definition list
ordered list - ol
An ordered list is a list with sequentially increasing numbers such as 1, 2, 3, . An ordered list is created with ol and the contents of the list with li.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>HTML</title>
</head>
<body>
<h1>Ordered List</h1>
<ol>
<li>Lorem</li>
<li>Ipsum</li>
<li>Dolor</li>
</ol>
</body>
</html>Add the start attribute to specify the starting number.
<ol start="5">Add the value attribute to specify a specific list number.
<li value="9">Below is a simple example using numbering. The numbers start at 5 and Dolor designated 9.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>HTML</title>
</head>
<body>
<h1>Ordered List</h1>
<ol start="5">
<li>Lorem</li>
<li>Ipsum</li>
<li value="9">Dolor</li>
</ol>
</body>
</html>In addition to numbers, alphabets, roman letters, Greek, etc. can be used for ordering. This is better set using CSS than HTML.
unordered list - ul
An unordered list is prefixed with a shape such as a point or rectangle instead of a number. Let ul be an unordered list and li be the contents of the list.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>HTML</title>
</head>
<body>
<h1>Unordered List</h1>
<ul>
<li>Lorem</li>
<li>Ipsum</li>
<li>Dolor</li>
</ul>
</body>
</html>The default value for shapes attached to lists is points. It is better to use CSS than HTML to convert to other forms.
definition list - dl
Definition lists are used to list terms and their meanings. The definition list is dl, the term is dt and its meaning is dd.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>HTML</title>
</head>
<body>
<h1>Definition List</h1>
<dl>
<dt>WWW</dt>
<dd>WWW represents World Wide Web.</dd>
<dt>HTML</dt>
<dd>HTML represents HyperText Markup Language.</dd>
</dl>
</body>
</html>a list within a list
You can have lists within lists.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>HTML</title>
</head>
<body>
<ol>
<li>
Lorem
<ol>
<li>Lorem</li>
<li>Ipsum</li>
<li>Dolor</li>
</ol>
</li>
<li>
Ipsum
<ul>
<li>
Lorem
<ul>
<li>Lorem</li>
<li>Ipsum</li>
<li>Dolor</li>
</ul>
</li>
<li>Ipsum</li>
<li>Dolor</li>
</ul>
</li>
<li>Dolor</li>
</ol>
</body>
</html>'HTML' 카테고리의 다른 글
| [HTML] HTML/em, strong/highlight text, important text (0) | 2022.08.12 |
|---|---|
| [HTML] HTML/q, blockquote/quote (0) | 2022.08.04 |
| [HTML] HTML/br/line break tag (0) | 2022.08.04 |
| [HTML] HTML/h1, h2, h3, h4, h5, h6, p/ title and paragraph (0) | 2022.08.04 |
| [HTML] HTML / Grammar (0) | 2022.08.04 |