Page 46 - Code & Click - 8
P. 46
5 List and Images in HTML5
Pre-Processing
Pre-Processing
• Working With Lists • Ordered List
• Description List • Inserting Images
With HTML5, you have learned how to create a web page, view it in a web browser, and format the
contents of a web page using CSS. Let us now learn how to create lists and insert images on a web page.
WORKING WITH LISTS
A List is made up of a number of related items written consecutively, such
as the names of students in a class or a shopping list. A list can be used on a
web page to display information in an easy-to-read and eye-catching format.
List Item Tag <li> … </li>
The List Item tag <li> is used to define each item of a list. It is a container tag and is closed by the
</li> tag.
Experiential Learning
Lab Activity 1
To create a simple list.
1. Open Notepad and create the HTML document as shown below.
2. Open the HTML document in Microsoft Edge.
<!DOCTYPE html>
<html>
<head> <title> Machine Learning </title>
</head>
<body>
<h2> Types of Machine Learning </h2>
<p> Machine Learning approaches can be
classified as follows: </p>
<li> Supervised Learning </li>
<li> Unsupervised Learning </li>
<li> Semi-supervised Learning </li>
<li> Reinforcement Learning </li>
</body>
</html>
Types of Lists
HTML provides three kinds of lists to specify information on a web
page:
(a) Unordered list (b) Ordered list (c) Description list
Unordered List
An Unordered list, also called a Bulleted list, is a list of related items in which the order of items is
not important. It uses a bullet in front of each item in the list.
44
