Page 71 - Computer - 8
P. 71
Creating a Nested List (A List inside a List)
A Nested list is a list within another list. You can nest a numbered or bulleted list, or both, within an
existing list to your web page.
Lab Activity 7
Experiential Learning
To create a nested list.
1. Open Notepad and create the HTML document as shown below.
<!DOCTYPE html> 2. Open the HTML document in Microsoft Edge.
<html>
<head> <title> Computer Memory </title> </head>
<style type= “text/css”>
ol {color: purple; list-style-type: decimal; list-
style-position: inside; font-size: 30px}
ul {color: blue; list-style-type: square; list-
style-position: inside; font-size: 25px}
h1 {color: red; text-align: center; font-size: 40px}
</style>
<body>
<h1> Types of Computer Memory </h1>
<ol>
<li> Primary Memory </li>
<ul>
<li> RAM </li>
<li> ROM </li>
<li> Cache </li>
</ul>
<br> <li> Secondary Memory </li>
<ul>
<li> Hard Disk Drive </li>
<li> Pen Drive </li>
<li> Memory Card </li>
</ul>
<br> <li> Tertiary Memory </li>
<ul>
<li> NAS </li>
<li> Cloud Storage </li>
</ul>
</ol>
</body>
</html>
Mind Fog ERROR
While using nested lists in HTML, make sure to end the inner list before you end the outer list.
Try This
Critical Thinking
Write the HTML tag that is used to perform the following tasks:
(a) Draw a horizontal line on a web page. ____________________
(b) Add explanatory notes for an HTML document. ____________________
(c) Create a list that uses alphabets for the items in the list. ____________________
(d) Insert a blank line on a web page. ____________________
(e) Create a dictionary of technical terms. ____________________
69
